Javascript Angularjs ui select（select2）未使用“控制器为”语法未选中
我正在尝试使用位于GitHub上的AngularJS ui select获得一个select HTML控件。出于某种原因，当使用$scope语法时，我能够选择该项，但当我使用控制器作为语法时，则无法选择该项。我正在尝试使用控制器的plunker语法已经找到。我不确定我遗漏了什么，尤其是因为$scope语法工作得非常好 我没有收到任何错误报告。下面是plunker中的一个片段 控制器 app.controllerMainCtrl，MainCtrlJavascript Angularjs ui select（select2）未使用“控制器为”语法未选中,javascript,angularjs,ui-select,angularjs-select2,angular-ui-select,Javascript,Angularjs,Ui Select,Angularjs Select2,Angular Ui Select,我正在尝试使用位于GitHub上的AngularJS ui select获得一个select HTML控件。出于某种原因，当使用$scope语法时，我能够选择该项，但当我使用控制器作为语法时，则无法选择该项。我正在尝试使用控制器的plunker语法已经找到。我不确定我遗漏了什么，尤其是因为$scope语法工作得非常好 我没有收到任何错误报告。下面是plunker中的一个片段 控制器 app.controllerMainCtrl，MainCtrl function MainCtrl() { v
function MainCtrl()
{
var controller = this;
controller.person = {};
controller.people = [
{ name: 'Adam', email: 'adam@email.com', age: 10 },
{ name: 'Amalie', email: 'amalie@email.com', age: 12 },
{ name: 'Wladimir', email: 'wladimir@email.com', age: 30 },
{ name: 'Samantha', email: 'samantha@email.com', age: 31 },
{ name: 'Estefanía', email: 'estefanía@email.com', age: 16 },
{ name: 'Natasha', email: 'natasha@email.com', age: 54 },
{ name: 'Nicole', email: 'nicole@email.com', age: 43 },
{ name: 'Adrian', email: 'adrian@email.com', age: 21 }
];
}
HTML中用作控制器别名的名称也应与Javascript文件中引用的varibale的名称相同。另外，您缺少MainCtrl方法中的作用域。 因此，在这里，JS中的变量应该是vm。您可以参考中的示例 请在下面找到更新的代码 Javascript
在修复所有脚本以使用https而不是plunker的http要求并将ng model=person.selected.name更改为ng model=vm.person.selected.name之后，ControllerAs版本可以完美地工作，无需进一步调整
感谢您对@Shashank的回复，我想使用控制器作为语法，而不是使用$scope？我猜这是不对的？另外，我已经读过几次了，现在$scope在Angular的新版本中消失了？这是错误的吗？使用控制器作为语法没有问题。但是$scope应该有一种注入方法，以便利用依赖注入，否则控制器如何知道作用域以及模型如何在控制器和模型之间绑定。我不知道示波器是否会消失。需要研究一下。-我明白你说的“它是怎么知道的”，但因为我是angular的新手，我猜根据我读到的所有东西，“控制器作为”语法就是这样，语法糖。通常，根据我的经验，语法上的sugar只意味着代码更短或更容易阅读，而不会丢失功能。下面是一些我一直在读的例子：思想？？设置$scope=vm对于angular 1.3+的新版本来说没有意义。事实上，在angular中使用$scope=vm可能会导致自动范围继承的意外复杂性。在添加ControllerAs之前，它是一种变通方法，不应该使用。angular 1.x中没有弃用$scope服务，它只是提供了一种替代格式，以便更轻松地过渡到angular 2。Angular 2是一个从头开始的完全重写，现有的特性都不是以相同的方式运行的。例如，在必要的广播时，您仍然可以注入$scope，但是使用ControllerAs可以让您选择不在任何情况下使用它。我知道Plumkers的要求，但我一定是完全忘记了将vm添加回去。谢谢你的更新。好久不见@克莱斯
function MainCtrl()
{
var controller = this;
controller.person = {};
controller.people = [
{ name: 'Adam', email: 'adam@email.com', age: 10 },
{ name: 'Amalie', email: 'amalie@email.com', age: 12 },
{ name: 'Wladimir', email: 'wladimir@email.com', age: 30 },
{ name: 'Samantha', email: 'samantha@email.com', age: 31 },
{ name: 'Estefanía', email: 'estefanía@email.com', age: 16 },
{ name: 'Natasha', email: 'natasha@email.com', age: 54 },
{ name: 'Nicole', email: 'nicole@email.com', age: 43 },
{ name: 'Adrian', email: 'adrian@email.com', age: 21 }
];
}
<body ng-controller="MainCtrl as vm">
<h3>Select2 theme</h3>
<p>Selected: {{vm.person.selected}}</p>
<ui-select ng-model="person.selected.name" theme="select2" ng-disabled="disabled" style="min-width: 300px;">
<ui-select-match placeholder="Select a person in the list or search his name/age...">{{$select.selected.name}}</ui-select-match>
<ui-select-choices repeat="person in vm.people | propsFilter: {name: $select.search, age: $select.search}">
<div ng-bind-html="person.name | highlight: $select.search"></div>
<small>
email: {{person.email}}
age: <span ng-bind-html="''+person.age | highlight: $select.search"></span>
</small>
</ui-select-choices>
</ui-select>
function MainCtrl($scope) {
var vm = this;
vm.person = {};
vm.people = [
{ name: 'Adam', email: 'adam@email.com', age: 10 },
{ name: 'Amalie', email: 'amalie@email.com', age: 12 },
{ name: 'Wladimir', email: 'wladimir@email.com', age: 30 },
{ name: 'Samantha', email: 'samantha@email.com', age: 31 },
{ name: 'Estefanía', email: 'estefanía@email.com', age: 16 },
{ name: 'Natasha', email: 'natasha@email.com', age: 54 },
{ name: 'Nicole', email: 'nicole@email.com', age: 43 },
{ name: 'Adrian', email: 'adrian@email.com', age: 21 }
];
$scope = vm;
}