Angular.js选择整合

the*_*unt 8 javascript angularjs jquery-chosen

我在我的角度视图中选择我要添加所选功能:

<select ng-options="value for value in deutscheBankEvent.dates" ng-init="" ng-model="chosenA" class="chzn-select">
 <option style="display:none" value="">Wählen Sie ein Datum</option>
 </select><br/>
Run Code Online (Sandbox Code Playgroud)

我的控制器:当我在这里注入.chosen函数时,它会清除选项.

function Ctrl($scope,$http) {

  $scope.text = '';
  $scope.user = {name: '', last: '', location: ''};
  $scope.value = 0;
  $scope.sendForm = function (){
       $http.post('/Submit/To/Url', $scope.data).success(function(data) {
           alert('done!');
       });
    };
}
Run Code Online (Sandbox Code Playgroud)

我的页脚:

<g:javascript>
 $(".chzn-select").chosen(); $(".chzn-select-deselect").chosen({allow_single_deselect:true});
            jQuery(".adressen1_chzn-select").chosen();jQuery(".adressen0_chzn-select").chosen();
        });
</g:javascript>
Run Code Online (Sandbox Code Playgroud)

我不知道,如何让所选择的工作.内部控制器它清除选项而不适用,其余部分没有任何区别.任何想法赞赏

Kul*_*lbi 10

您的解决方案将无法工作,因为在DOM中实际创建元素之前会触发jQuery代码.您应该使用表单元素上的指令解决此问题.

元素需要动态创建,因此您实际上在DOM元素上运行 - 完全适合Angular的指令.不需要使用jQuery,并尝试在使用Angular时避免使用它.请注意,由于选择了依赖项,仍然需要jQuery .

我用这个集合解决了这个问题:

  1. 角度选择指令https://github.com/localytics/angular-chosen
  2. [可选] Bootstrap3样式https://github.com/alxlit/bootstrap-chosen

我建议你自己尝试写这个指令.这是一个很好的做法.您可以尝试使用此功能:http://www.youtube.com/watch?v = 8ozyXwLzFYs

祝好运!


Ste*_*wie 7

你应该试试http://angular-ui.github.com/

这是一套角度指令.其中你会发现'select2'指令作为Chosen插件的代理(准确地说是Select2插件).

  • Select2与选择的不一样. (5认同)