Question

我正在尝试在AngularJS中创建一个无线电类型按钮选择。这是我的代码。

HTML code：

force.nodes()

控制器代码：

<!-- Page Content -->
<div id="page-wrapper">
<div class="container-fluid">
    <h3 class="page-header">Create Products</h3> 
    <div class="media-list" data-toggle="buttons">
      <label class="btn btn-default col-md-2 custom-thumbnail">
        <input type="radio" ng-model="platformSel" ng-change="tileSelect(value)" value="win" name="platform-selection" id="win-tile" >
        <i class="center-block fa fa-windows fa-5x"></i>
        <span class="text-center">Windows</span>
      </label>
      <label class="btn btn-default col-md-offset-custom col-md-2 custom-thumbnail">
        <input type="radio" ng-model="platformSel" ng-change="tileSelect(value)" value="mac" name="platform-selection" id="mac-tile">
        <i class="center-block fa fa-apple fa-5x"></i>
        <span class="text-center">MAC</span>
      </label>
    </div>
  </div>
  <!-- /.container-fluid -->
</div>
<!-- /#page-wrapper -->

我没有在'tileSelect'函数中看到任何调用。我不知道为什么。任何帮助表示赞赏。我是Angular JS的新手。

Answer 1

JavaScript控制台中是否有错误？如前所述，您缺少ng-app和ng-controller指令。

<div id="page-wrapper" ng-app="pacman" ng-controller="createProductCtrlr">

其余代码几乎正确但是由于您将无线电绑定到模型变量，因此无需在ng-change函数中传递参数。

$scope.tileSelect = function() {
    console.log($scope.platformSel + " selected");
};

选中此fiddle

Answer 2

调试和修复内容非常困难。不像从头开始编写代码那么简单。

原因是'data-toggle = buttons'只是切换引导UI并且不进行任何函数调用。从html行中删除class =“media-list”并且有效。

答案：

data-toggle =“buttons”只是切换双按钮组。不允许进行函数调用。

ng-change和ng-click不会触发控制器中的事件

2 个答案: