我想在我的代码中看到一个单选按钮组.我使用AngularJs,Angular-Strap和Bootstrap.
问题是,当我点击另一个按钮时,控制器中的变量不会更新.默认值已设置.
如果我删除输入标签周围的标签,更新发生…我不知道这是一个错误,或者我是否做错了什么..
我希望我提供了你需要的任何信息.
谢谢你的帮助!!
版本:
AngularJS:1.2.16
Angularstrap:2.0.2
Bootstrap:3
HTML:
<link href="Content/bootstrap.min.css" rel="stylesheet" /> <link href="Content/style.css" rel="stylesheet" /> <link href="Content/bootstrap-additions.css" rel="stylesheet" /> <link rel="stylesheet" href="//rawgithub.com/mgcrea/angular-motion/master/dist/angular-motion.min.css">
单选按钮:
<label class="control-label">Group By:</label> <div class="btn-group" ng-model="groupBy.value" data-bs-radio-group> <label class="btn btn-default" for="all"> <input name="all" type="radio" class="btn btn-default" value="all"> All </label> <label class="btn btn-default" for="room"> <input name="room" type="radio" class="btn btn-default" value="room"> Room </label> <label class="btn btn-default" for="category"> <input name="category" type="radio" class="btn btn-default" value="category"> Category </label> </div>
二手图书馆:
<script src="libraries/angular.min.js"></script> <script src="libraries/jquery.min.js"></script> <!-- UI Libs --> <script src="libraries/bootstrap.min.js"></script> <script src="libraries/angular-strap.min.js"></script> <script src="libraries/angular-strap.tpl.min.js"></script>
控制器:
$scope.groupBy = { value: 'room' };
更新:
模块定义:
var app = angular.module('deviceApp',['ngRoute','mgcrea.ngStrap','ngAnimate']); app.config(function ($routeProvider) { $routeProvider .when('/devices',{ controller: 'DeviceController',templateUrl: '/app/partials/devices.html' }) .otherwise({ redirectTo: '/devices' }); }); app.controller('DeviceController',function ($scope,$log,$alert,deviceService) { $scope.groupBy = { value: 'room' }; ... <html data-ng-app="deviceApp"> ...
在我看到这个工作的plnkr之后,我将我的代码逐个粘贴到它中.
既然它仍然有效,我就像我恶作剧或其他东西一样……
既然它仍然有效,我就像我恶作剧或其他东西一样……
因此,在loooooong试错阶段后,我发现了差异……
如果我在包含bootstrap.min.js之后包含jquery.js我得到错误,Bootstrap的JavaScript需要jQuery.这导致了这种情况,引导程序未被包括在内并且一切正常.
在我开发的某个时候,我需要Bootstrap.min.js,但我注意到了,我不再需要它了.可能其他一些文件现在可以完成这项工作.因此删除bootstrap.min.js文件解决了这个问题.
原文地址:https://www.jb51.cc/angularjs/141046.html
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。