zoukankan      html  css  js  c++  java
  • angularjs学习之模板

    angularJs是模型-视图-控制器(MVC)的模式

    先看一下模型和控制器:

    controller.js:

    function PhoneListCtrl($scope) {
          $scope.phones = [
            {"name": "Nexus S",
             "snippet": "Fast just got faster with Nexus S."},
            {"name": "Motorola XOOM™ with Wi-Fi",
             "snippet": "The Next, Next Generation tablet."},
            {"name": "MOTOROLA XOOM™",
             "snippet": "The Next, Next Generation tablet."}
          ];
        }
    

     在controllers.js中有控制器PhoneListCtrl,控制器中初始化了一组数据模型。控制器的作用可以使模型和视图之间数据连接起来。

    下面看一下模式如何引导视图的变化:

    index.html

    <body ng-controller="PhoneListCtrl">
        <ul>
            <li ng-repeat="phone in phones">
                {{phone.name}}
                <p>{{phone.snippet}}</p>
            </li>
        </ul>
    </body>
    

      ng-controller定义了控制器(PhoneListCtrl)的作用域,只有在作用域下才能执行控制器相关指令。

      通过ng-repeat可以实现模型数据的遍历,双花括号可以实现数据的取值(类似js的表达式)。

    
    

     

  • 相关阅读:
    php7垃圾回收机制
    PHP-FPM
    go main.main之前的准备
    ElementUI MessageBox 弹框
    ElementUI table 样式修改
    ElementUI Dropdown 下拉菜单
    vue+django实现下载文件
    ElementUI 点击展开/隐藏
    vue+django实现websocket连接
    ElementUI 上传文件以及限制
  • 原文地址:https://www.cnblogs.com/smartyu/p/5206389.html
Copyright © 2011-2022 走看看