ng-Model值在HTML中的其他指令中的用法

时间:2014-03-28 09:26:36

标签: javascript html angularjs

我的控制器JS中有以下数据,

此处主题和考试对象与主题对象中的代码值相关,例如,如果主题名称为“科学”,则代码为“sci”,并且我尝试在mg-model“myOptionSub”中保存此“sci”并且我尝试在第二个下拉列表中根据模型值“myOptionSub”和下面的div显示与“sci”相关的数据。我无法使用第二个下拉列表中第一个下拉列表给出的ng-model值。

    myApp.controller('parentCtrl', ['$scope', '$window', '$location', function ($scope, $window, $location) {

    $scope.subject = {
        "subarray": [{
            'name': 'science',
            'code': 'sci'
        }, {
            'name': 'maths',
            'code': 'mat'
        }]
    };
    $scope.exam = {
        "sci": [{
            'name': 'science 1',
            'examcode': 's1'
        }, {
            'name': 'science 2',
            'examcode': 's2'
        }],
            "mat": [{
            'name': 'maths 1',
            'examcode': 'm1'
        }, {
            'name': 'maths 2',
            'examcode': 'm2'
        }]
    };
}]);

我的HTML

<select
    ng-model="myOptionSub"
    ng-options="subjectobj.code as subjectobj.name for subjectobj in subject.subarray">

</select>
<div>subject model: {{myOptionSub}}</div>
<div>subject model: {{exam.myOptionSub}}</div>

<select
    ng-model="myOptionExam"
    ng-options="examobj.examcode as examobj.name for examobj in exam.myOptionSub">

</select>


<div>exam model: {{myOptionExam}}</div>

这里我想使用第一个下拉列表的选定值(存储在模型“myOptionSub”中)作为过滤器来显示所选下拉列表中的项目。

我的疑问是在HTML中的地方以及我如何在原始HTML和任何指令中使用模型值,如我的示例中的ng-repeat。

JS小提琴http://jsfiddle.net/shmdhussain/uh5VU/#run

1 个答案:

答案 0 :(得分:1)

这就是您要找的FIDDLE

通过使用ng-change,你可以实现它

 $scope.changesecond = function(){

    $scope.exam.myOptionSub = $scope.exam[$scope.myOptionSub];
    console.log($scope.examobj)
 }