6

コードでわかるように、ラジオボタン グループが必要です。私は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">
...
4

1 に答える 1

13

この動作するplnkrを見た後、コードを部分的に貼り付けました。まだ動いていたので、イタズラか何かされたような気がしました...

だから、長い試行錯誤の段階の後、私は違いを発見しました....

bootstrap.min.js をインクルードした後にjquery.js をインクルードすると、Bootstrap の JavaScript には jQuery が必要であるというエラーが表示されます。これにより、ブートストラップが正しく含まれておらず、すべてが機能するというケースが発生しました。

私の開発のある時点で Bootstrap.min.js が必要でしたが、もう必要ないことに気付きました。おそらく、他のファイルがその仕事をしています。そのため、bootstrap.min.js ファイルを削除すると問題が解決しました。

于 2014-05-13T19:37:07.900 に答える