如何解决角度列表的bootstrap.js和angularjs之间的冲突

时间:2014-09-16 18:50:28

标签: javascript css angularjs twitter-bootstrap

这是我的HTML代码

<div class="form-group">

     <select ng-model="modSelectedState" id="selectState" name="selectState"
          ng-options="state as state.full_name for state in states">
          <option value="">Select State...</option>                                         </select>
     </div><!-- /.form-group -->

它按预期呈现,直到我将此行添加到我的代码中:

 <script type="text/javascript" src="scripts/bootstrap/js/bootstrap.min.js"></script>

我在渲染页面时看到的所有内容都是默认选项(&#34;选择状态&#34;)。当我删除bootstrap.js时,所有内容都按预期呈现 - 这就是我看到所有状态的列表。

这是我在控制器中加载代码的方式

 $http.get('./data/states.js').success(function (data) {
        $scope.states = data.locations;
    });

states.js存储在本地。

我在页面上有一些其他角度元素,它们都可以正常工作。我也尝试使用加载顺序(即在角度之前加载bootstrap,反之亦然),但结果是相同的 - 列表渲染没有引导程序,并且它不用引导程序渲染。

绑定列表时,这两个库之间是否存在任何已知冲突?有没有已知的解决方法?

1 个答案:

答案 0 :(得分:0)

您需要使用controls specially prepared to work with bootstrap and angular ...否则您不仅会遇到此类意外问题,而且还会因您尝试制作自己的问题而遇到其他类型的问题当已经存在使用javascript库的有效方法时实现。最好的问候。