angularjs - ng-if 中未更新 ng-model

Question

我无法在我的选择 html 块中检索我选择的选项 (ng-model=filter) 的实际值。

请注意，如果我不设置 $scope.filter 则 $scope.filter 保持未定义，即使我在下拉列表中选择了一个选项。

我的 html 模板，filters.html:

<div ng-if="!showFilterTemplatePlz">
<button class="btn btn-primary" ng-click="showFilterTemplate()" type="button">Add Filter</button>
</div>
<div ng-if="showFilterTemplatePlz" class="inline">
<button class="btn btn-primary" ng-click="closeFilters()" type="button">Close filters</button>
<label>filters</label>
<select ng-model="filter" ng-options="filter.name for filter in filterOptions" class="form-control">
</select>
<p>{{filter.name}}</p>
<button ng-click="addFilter()" id="addFilterButton" class="btn btn-primary btn-sm btn-default" type="button"><i class="fa fa-plus"></i> Add</button>
</div>

在我的指令中:

      .directive('filters', ['retrieveStaticDatasService','usersService', function(datasService, usersService) {
        return {
            restrict: 'E',
            scope: false,
            controller: function ($scope) {
                /* init */
                $scope.filterOptions = [
                    {name: "languages"},
                    {name: "nationality"},
                    {name: "location"}
                ];
                $scope.filter = $scope.filterOptions[0];
                /* end init */
                $scope.showFilterTemplate = function(){
                      $scope.showFilterTemplatePlz=true;
                }
                $scope.closeFilters = function(){
                    $scope.showFilterTemplatePlz=false;
                }
                $scope.addFilter = function(){
                    console.log("filter to add : " + $scope.filter.name);                        
                }
            },
            templateUrl: '/partials/components/filters.html'
        }
    }])

结果 :

我可以看到实际值出现在我的 html 中，但我将始终在控制台中显示 $scope.filter.name 的“语言”，无论我选择什么选项!我截图给你看: http://hpics.li/4a37ae3

谢谢你的帮助。

[编辑:我做了一些测试，我的模型只有在它们不在“ <div ng-if="..."></div>”中时才会被设置和更新]。不允许直接在指令中放置 ng-if 吗？

答案 : Angularjs ng-model doesn't work inside ng-if

Answer 1

我找到了解决方案，问题是 ng-if 创建了一个子作用域。所以我把过滤器改成了 $parent.filter 在

 <select ng-model="$parent.filter" ng-options="option.name for option in filterOptions" class="form-control">
      </select>