Question

我正在尝试使用Angular和Chosen创建一个selecbox。我似乎无法让它发挥作用。我觉得我还在上传错误的脚本，但不知道如何上传正确的脚本。我安装了使用凉亭选择。首先我试过：

<script src="bower_components/jquery/dist/jquery.js"></script>
<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/angular-chosen-localytics/chosen.js"></script>

angular.module('myApp', ['localytics.directives'])

但后来我得到一个错误，说elemnt.chosen是未定义的。我读到在加载角度后加载jquery时会发生这种情况。所以我试过了：

<script src="bower_components/angular-chosen-localytics/chosen.js"></script>
<script src="bower_components/jquery/dist/jquery.js"></script>
<script src="bower_components/angular/angular.js"></script>

但这不起作用，因为没有定义角度。我发现我有两个单独的凉亭组件，实际的选择组件和角度选择指令组件。所以我也添加了所选的脚本：

<script src="bower_components/jquery/dist/jquery.js"></script>
<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/angular-chosen-localytics/chosen.js"></script>
<script src="bower_components/chosen/chosen.jquery.js"></script>
<script src="bower_components/chosen/chosen.proto.js"></script>
<script src="bower_components/angular-chosen-localytics/chosen.js"></script>

错误消失了，但元素不起作用。我得到一个简单的栏，没有选项和格式错误的文本。有谁知道我做错了什么？

不起作用的元素：

<select chosen
  data-placeholder="Pick one of these"
  disable-search="true"
  allow-single-deselect="true">
  <option value=""></option>
  <option>This is fun</option>
  <option>I like Chosen so much</option>
  <option>I also like bunny rabbits</option>
</select>

Answer 1

<强> 修改

对我来说这个订单有效：

CSS：

($scope.confirms())

在这里找到selected-bootstrap.css：https://gist.github.com/koenpunt/6424137

脚本：

<link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.css">
<link rel="image_src"  href="bower_components/chosen/chosen-sprite.png">
<link rel="stylesheet" href="bower_components/chosen/chosen.css"/>
<link rel="stylesheet" href="styles/chosen-bootstrap.css"/>

响应能力的自定义指令：

<script src="bower_components/jquery/dist/jquery.js"></script>
<script src="bower_components/chosen/chosen.proto.js"></script>
<script src="bower_components/chosen/chosen.jquery.js"></script>
<script src="bower_components/bootstrap/dist/js/bootstrap.js"></script>

<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/angular-chosen-localytics/chosen.js"></script>

模块：

  return {
      restrict: 'A',
      replace: false,
      transclude: false,
      link: function(scope, element) {
          element.chosen({ width: '100%' });
      }
  };

元素：

var module = this.module('MyModule', ['ngRoute', 'localytics.directives']);

Anuglar选择的localytics无法正常工作

1 个答案: