Question

关于这个主题有很多帖子，但是没有一个符合我的要求:( 问题如下：我即将控制几个设备，这意味着我只能在某些寄存器中读写。

有所谓的通道，一个（硬件指定）仅用于读取，另一个仅用于写入。例如，这可以打开和关闭设备，0和1。

现在，我想显示当前状态，以及交互可能性（通过复选框）将其关闭和打开。我必须将它分开，因为通信间隔只是每隔几秒钟，并且用户应该有一些反馈，如果他的命令已经正确处理（通信或命令可能被大大延迟或损坏，因此设备仍将在运行。）

现在：开始时，设备已开启 - ＆gt;意思是阅读频道正在发送1，我可以阅读。现在我希望写入频道作为复选框，最初根据阅读频道的值进行检查。然后，在命令之后，Reading-Channel值将改变（但请记住，它可能不会被绑定在一起！）

我试过几种方式，在我的例子中你可以找到：

ng-init="device.channels[$index-1].enabled==1"

这是我的最后一次尝试。价值就在那里，但他不会检查:(。

我已经阅读了几个主题，你应该保持ng-checked和ng-model分开，我只是不知道该怎么做。设备/通道结构非常类似于我将要使用的设备/通道结构，我只是为您简化了它。

我的HTML：

<!DOCTYPE html>
<html ng-app="plunker">
  <head>
    <script data-require="angular.js@1.2.20" data-semver="1.2.20" src="https://code.angularjs.org/1.2.20/angular.js"></script>
    <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css" />
    <link rel="stylesheet" href="style.css" />
    <script src="script.js"></script>
  </head>
   <body ng-controller="MainCtrl">
    <legend>UI</legend>
    <div ng-repeat="channel in device.channels" ng-switch on="channel.name"> 
      <span ng-switch-when="Read-Channel">    
        <p ng-if="channel.enabled==1">Device is ON</p>
        <p ng-if="!channel.enabled==0">Device is OFF</p>                            
      </span>   
          <!-- initial problem -->
      <span ng-switch-when="Write-Channel"> 
           <input type="checkbox"
             ng-init="device.channels[$index-1].enabled==1"
             ng-model="channel.enabled"
             ng-change="stateChanged(channel.enabled)">
           Device is off: {{ channel.enabled == 1 }} 
      </span>
    </div>        
    <legend>Data</legend>
    <div>
      {{ device | json }}
    </div>
  </body>   
</html>

我的JS：

var app = angular.module('plunker', []);   
app.controller('MainCtrl', function($scope) {
  $scope.device = { 
    channels: [
      { name: 'Read-Channel', enabled: 1 }, 
      { name: 'Write-Channel', enabled: 0 }
    ]
    };       
    $scope.stateChanged = function(value){
      console.log("Sending command to turn device off?" + (value == 1));
     };
});

对于实时版本，请参阅Plunker：http://plnkr.co/edit/vFvWjyQN14HKHAHvBKh5?p=preview

非常感谢你！

Answer 1

我建议您只将启用写入通道的值初始化为控制器中启用的读取通道的值，因为这是您希望它开始的位置。如果您不想这样做，那么我建议不要将复选框绑定到模型，然后通过ng-click of ng-change手动设置值。由于您已经绑定到模型并且模型具有值，因此该值将优先于您在ng-init中执行的任何操作，因为只要摘要周期启动就会读取模型。

Answer 2

如果我理解你的话，我有一些为你解决的建议。

<body ng-controller="MainCtrl">
<legend>UI</legend>
<input type="checkbox"
 ng-model="device.enabledChannel"
 ng-change="stateChanged(device.enabledChannel)">
<div ng-repeat="channel in device.channels">
  <span ng-show="channel.enabled == device.enabledChannel"> 
        <p ng-if="channel.enabled">Device is ON</p>
        <p ng-if="!channel.enabled">Device is OFF</p>                           
        Device is off: {{ channel.enabled == 1 }} 
  </span>

</div>

<legend>Data</legend>
<div>
  {{ device | json }}
</div>

设备obj的一些变化：

$scope.device = {
  enabledChannel: true,
  channels: [
    { name: 'Read-Channel', enabled: 1 }, 
    { name: 'Write-Channel', enabled: 0 }
  ]
};

Angular Checkbox，来自ng-model

2 个答案: