Angular指令不能与select一起工作

Angular directives don't work with selects

本文关键字：一起 工作 select 指令 不能 Angular      更新时间：2023-09-26

我似乎无法使用Angular指令获得select !我有两个选择，都在指令中。我想为第一次选择确定第二次选择的可用选项。

Here's a fiddle:
http://jsfiddle.net/jordannpotter/hfyUa/

  1. 从"次要选择"中选择"Baz"
  2. 从"Primary Select"中选择"First"
    3. 注意"Secondary Select" 变为空白!!

当然，如果你注释掉指令代码(第3-9行)，它可以完美地工作。

这里发生了什么，我怎么解决它??

所以你所发生的是指令的作用域将你从控制器的作用域中分离出来，你需要在主要和次要变量之前添加一个对象级别。

var app = angular.module('myApp', [])
app.directive('awesomeDirective', function () {
    return {
        restrict: 'E',
        transclude: true,
        template: '<div class="awesome" ng-transclude></div>'
    }
});
AwesomeController = function ($scope, $timeout) {
    $scope.options = {};
    updateAllowedSecondaryOptions = function () {
        if ($scope.options.primary == 'primaryOption1') {
            $scope.secondaryOptions = [
                {value: 'foo', title: 'Foo'}, 
                {value: 'bar', title: 'Bar'},
                {value: 'baz', title: 'Baz'}]
        } else if ($scope.options.primary == 'primaryOption2') {
            $scope.secondaryOptions = [ 
                {value: 'bar', title: 'Bar'},
                {value: 'baz', title: 'Baz'}]
        }
        $scope.options.secondary = $scope.secondaryOptions[0]
    }
    $scope.options.primary = 'primaryOption2'
    updateAllowedSecondaryOptions()
    $scope.primarySelected = function (newValue) {
        $scope.options.primary = newValue;
        updateAllowedSecondaryOptions()
    }
};
http://jsfiddle.net/G5PLL/

你可以通过阅读https://github.com/angular/angular.js/wiki/Understanding-Scopes了解更多正在发生的事情，这将使你脱离原型继承。

注:米斯科规则"当你有一个n -模型的时候，一定会在某个地方有一个点。

相关文章：