发表于: 2018-07-02 22:48:24

1 384


今天完成的事情:

1.用Angularjs  ng-options指令写了下拉列表。

在学习Angularjs之前,下拉列表是用HTML <select> 标签写的

<select>

  <option value="volvo">Volvo</option>

  <option value="saab">Saab</option>

  <option value="opel">Opel</option>

  <option value="audi">Audi</option>

</select>

学了Angularjs,可以用Angularjs  ng-options指令实现下拉列表。

<div ng-app="myApp" ng-controller="myCtrl">

<select ng-model="selectedName" ng-options="item for item in names">

</select>

</div>

<script>

var app = angular.module('myApp', []);

app.controller('myCtrl', function($scope) {

    $scope.names = ["Emil", "Tobias", "Linus"];

});

</script>

2.学习ng-change指令

ng-change 指令用于告诉 AngularJS 在 HTML 元素值改变时需要执行的操作。

ng-change 指令需要搭配 ng-model 指令使用。

当输入框的值改变时执行函数:

<body ng-app="myApp">

<div ng-controller="myCtrl">

  <p>在输入框中输入一些信息:</p>

  <input type="text" ng-change="myFunc()" ng-model="myValue" />

  <p>输入框已经修改了 {{count}} 次。</p>

</div>

<script>

  angular.module('myApp', [])

    .controller('myCtrl', ['$scope', function($scope) {

      $scope.count = 0;

      $scope.myFunc = function() {

        $scope.count++;

      };

    }]);

</script>

</body>


<input>, <select>, 和  <textarea> 元素都可以使用ng-change 指令


3.

3.1 为分页添加ng-change事件,

ng-change="change()"

3.2 请求当前分页的数据

size: $stateParams.size

明天计划的事情:写搜索部分

遇到的问题:写了两个日历表,它们会同时出现。

收获:ng-options指令、ng-change指令



返回列表 返回列表
评论

    分享到