Dart 如何在子属性更改时触发NgComponent的更新_Dart_Angular Dart

Dart 如何在子属性更改时触发NgComponent的更新

dart

Dart 如何在子属性更改时触发NgComponent的更新,dart,angular-dart,Dart,Angular Dart,我是一个完全初学者，以安格拉镖（和飞镖）；我遵循了教程，但这似乎是我找不到答案的我有两个工作完美的组件：我的控制器“ctrl”有一个名为“car”的属性，“car”有一个名为“color”的属性。当“car.color”更改时，colorButton NgComponent会更新，但carImage NgComponent不会更新当“car.color”更改时，如何触发carImage更新谢谢您必须将手表设置为车内的颜色。它的外观取决于您在car中使用的数据结构 //构造函数

我是一个完全初学者，以安格拉镖（和飞镖）；我遵循了教程，但这似乎是我找不到答案的

我有两个工作完美的组件：

我的控制器“ctrl”有一个名为“car”的属性，“car”有一个名为“color”的属性。当“car.color”更改时，colorButton NgComponent会更新，但carImage NgComponent不会更新

当“car.color”更改时，如何触发carImage更新

谢谢

您必须将手表设置为车内的

颜色。
它的外观取决于您在car中使用的数据结构
//构造函数
CarImage（范围）{
范围：$watch（（）=>car.color，（color）=>doSomething（color））；
}
这里是一个没有范围
和监视
功能的工作示例。我相信这是一个狭隘的解决方案
更多关于这个问题的信息：
ang_testi.dart
import 'package:angular/angular.dart';

@NgComponent(
 selector: 'colorImage',
 template: r'<p>colorImage: <input type="text" ng-model="cmp.carColor"></p>',
 publishAs: 'cmp'
)
class colorImage {
  @NgTwoWay('car-color')
  String carColor;
}

@NgComponent(
    selector: 'carImage',
    template: r'<p>carImage: <input type="text" ng-model="cmp.car.color"></p>',
    publishAs: 'cmp'
)
class carImage {
  @NgTwoWay('car')
  Map car;
}

@NgController(
    selector: '[main-test]',
    publishAs: 'ctrl')
class MainTestController {
  Map car = {"color":"green", "image":"someImage"};
}

class MyAppModule extends Module {
  MyAppModule() {
    type(MainTestController);
    type(colorImage);
    type(carImage);
  }
}

void main() {
  ngBootstrap(module: new MyAppModule());
}

导入“包：角度/角度.dart”；
@NGO组分(
选择器：“colorImage”，
模板：r'彩色图像：，
出版物：“cmp”
)
类彩色图像{
@NgTwoWay（“汽车颜色”）
字符串颜色；
}
@NGO组分(
选择器：“carImage”，
模板：r'carImage:'，
出版物：“cmp”
)
类carImage{
@NgTwoWay（“汽车”）
地图车；
}
@NGC控制器(
选择器：“[主测试]”，
publishAs:'ctrl'）
类MainTestController{
地图车={“颜色”：“绿色”，“图像”：“someImage”}；
}
类MyAppModule扩展模块{
MyAppModule（）{
类型（MainTestController）；
类型（彩色图像）；
类型（carImage）；
}
}
void main（）{
ngBootstrap（模块：newmyappmodule（））；
}

ang_testi.html
<!DOCTYPE html>

<html ng-app>
  <head>
    <meta charset="utf-8">
    <title>ng-model test</title>
    <link rel="stylesheet" href="ang_testi.css">
  </head>
  <body main-test>
    <colorImage car-color="ctrl.car.color"></colorImage> 
    <carImage car="ctrl.car"></carImage> 

    <p>controller: <input type="text" ng-model="ctrl.car.color"></p>
    <p>color is {{ctrl.car.color}}</p>

    <script src="packages/shadow_dom/shadow_dom.min.js"></script>
    <script type="application/dart" src="ang_testi.dart"></script>
    <script src="packages/browser/dart.js"></script>
  </body>
</html>


ng模型试验
控制器：
颜色为{ctrl.car.color}
谢谢，这就是我要找的。它似乎比直接绑定慢一点，但仍然可以正常工作！在控制器中，不需要类型“Map”，“String color；”就足够了。例如，在调用carImage组件时，可以使用整个控制器作为参考（这很有趣）。组件内部的变量需要定义为“var car；”以获得正确的类型。