代码之家 › 专栏 › 技术社区 › Learning-Overthinker-Confused

无法在下拉控件中设置所选选项

angularjs javascript

Learning-Overthinker-Confused · 技术社区 · 6 年前

$scope.Types 里面 $scope.obj . 它应该有属于 $范围.类型 $scope.obj.type

var app = angular.module("myApp", []);
app.controller("MyController", function($scope) {
   $scope.types =
        [
            { label: "Pizza", value: 1 },
            { label: "Cakes", value: 2 },
            { label: "Pastry", value: 3 }
        ];
        
         $scope.obj = { type : 1 };//I want dropdown selected value to be updated in type variable
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<ul ng-app="myApp" ng-controller="MyController">
 <select name="status" ng-model="obj.value"
 ng-options="type.value as type.label for type in types track by type.value">
       <option value="">Select Types</option>
</select>
 </ul>

我不明白我在这里做错了什么。

2 回复 | 直到 6 年前

Abhishek Kumar Seth 6 年前

 var app = angular.module("myApp", []);
app.controller("MyController", function($scope) {

   $scope.obj = {};
   $scope.types =
        [
            { label: "Pizza", value: 1 },
            { label: "Cakes", value: 2 },
            { label: "Pastry", value: 3 }
        ];
         
         $scope.obj.value = 2;
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<ul ng-app="myApp" ng-controller="MyController">
 <select name="status" ng-model="obj.value"
 ng-options="type.value as type.label for type in types">
       <option value="">Select Types</option>
</select>
 </ul>

holydragon 6 年前

这样地?

var app = angular.module("myApp", []);
app.controller("MyController", function($scope) {
   
   $scope.$watch('selectedValue', function(newValue, oldValue) {
        if (newValue){
            $scope.obj.type = newValue.value;
        }
   });
   $scope.types =
        [
            { label: "Pizza", value: 1 },
            { label: "Cakes", value: 2 },
            { label: "Pastry", value: 3 }
        ];
   $scope.obj = { type: 1 };
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<ul ng-app="myApp" ng-controller="MyController">
 <select name="status" ng-model="selectedValue"
 ng-options="type as type.label for type in types track by type.value">
       <option value="">Select Types</option>
</select>
{{ obj.type}}
 </ul>

推荐文章

code-geek · Jquery根据单选按钮选择隐藏或显示文本字段

3 月前

Niobos · 如何/是否有方法使通用算法函数同时与同步和异步函数一起工作?

3 月前

Alex · 在轻量级中同时解构和不解构变量

3 月前

Ângelo Rigo · ReactJS映射:如何迭代[关闭]

3 月前

bairog · 从按属性筛选的对象数组字典中创建值数组

4 月前

KaiMcKiernan · 基于Math.random()的函数在另一个函数内不起作用[关闭]

4 月前

David Jeong · 浏览器不会为浏览器自动添加的某些标头发送CORS预检请求吗?

4 月前

user29519291 · 为不同的变量创建一个带有可重用Click函数的简单菜单

4 月前

user3472810 · Angular@Output/EventEmitter返回undefined

4 月前

lokiuucx · JS对象属性返回未定义,尽管对象属性应该有值

4 月前