0

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

有所谓的通道,一个(硬件指定)仅用于读取,另一个仅用于写入。例如,用于打开和关闭设备,0 和 1。

现在,我想显示当前状态,以及交互可能性(通过复选框)来关闭和打开它。我必须保持分开,因为通信间隔只有几秒钟,用户应该有一些反馈,如果他的命令被正确处理(通信或命令可能会大大延迟或中断,因此设备仍将运行)。

现在:一开始,设备处于开启状态 -> 意味着 Reading-Channel 正在发送 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

非常感谢您!

4

2 回答 2

1

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

于 2016-05-18T12:15:13.753 回答
0

如果我没有理解你的话,我有一些解决你的建议。

<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 }
  ]
};
于 2016-05-18T13:08:18.367 回答