Question

我正在使用ng-repeat从关联数组创建一个选择列表.list的ng-model绑定到一个具有一些初始值的范围变量。生成的选项的值是数组的键。< / p>

但是，列表没有使用模型的值初始化。我认为它可能与ng-repeat的异步行为有关，所以我创建了一个指令来捕获渲染的结束并发出一个事件。此事件在控制器中捕获，用于重新分配ng-model的值。

事件被正确捕获，但对ng模型的更新没有反映出来。

如果我将一个函数附加到更新变量的按钮，它会在列表中正确显示。

我知道这是因为ng-repeat工作的方式。我如何解决这个问题，在渲染列表后自动设置初始值。

以下是我的问题的一个例子：

http://jsbin.com/gapemenova/1/edit?html,js,output

HTML：

    <h1 align='center'>
        {{value}}
   <select ng-model='value' >
    <option ng-repeat='(tid,groups) in templates' value='{{tid}}' on-last-repeat >{{tid}} </option>
</select>
      <button ng-click='refresh()' >Refresh</button>
</body>

JS：

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

//Create A Directive To Detect The End Of ng-repeat cycle.
    app.directive('onLastRepeat',function(){
        return function(scope,element,attrs) {
            if(scope.$last) { setTimeout(function(){
                scope.$emit('onRepeatLast',element,attrs);
                },10);
                    }
        };
    });

app.controller('goboCtrl',function($scope){
            //Initial Value
                  $scope.value="2";
       $scope.$on('onRepeatLast', function(scope, element, attrs){
                    $scope.value='3';
          alert($scope.value); });

   //Data Source For ng-repeat
    $scope.templates={};
    $scope.templates["1"]=[{"prop":"value1"}];
    $scope.templates["2"]=[{"prop":"value2"}];
    $scope.templates["3"]=[{"prop":"value3"}];

    $scope.refresh=function(){
            $scope.value="2";      
     };

}); //Controller ends

Answer 1

查看此工作演示：JSBin

只需将df = sqlContext.createDataFrame( [("Bob", 5), ("Alice", 6), ("Chuck", 4)], ("name", "age")) df.where("name in ('Bob', 'Alice')") df.where((df.name == "Bob") | (df.name == "Alice"))更改为：

即可

option

添加<option ng-repeat='(tid,groups) in templates' value='{{tid}}' ng-model="value" ng-selected="value === tid" on-last-repeat >{{tid}}</option>会将所选值绑定到ng-model。使用$scope.value动态更新所选项目。

说明

在ng-selected到ng-repeat结尾处的更新超出了Angular $on生命周期，您需要运行$digest以手动触发$scope.$apply周期。查看JSBin

$digest默认会触发ngClick。检查Angular 1.4.1第23244行中的$scope.$apply定义：

ngClick

Answer 2

您应该使用ng-options而不是使用ng-repeat将您的选项绑定到您的阵列。有关ng-options的更多信息：https://docs.angularjs.org/api/ng/directive/ngOptions

设置通过ng-repeat生成的选择列表的初始值

2 个答案:

说明