Question

我正在扩展angular.dart教程以进行一些简单的CRUD操作。我正在尝试做一个漂亮的智能组合框（下拉框），它正在获取KeyValuePairs列表并返回Selected KeyValyePair。不幸的是我收到了这个错误。

Model did not stabilize in 10 digests. Last 3 iterations:
itemsMap: collection: Instance of 'KeyValuePair'[null -> 0], Instance of 'KeyValuePair'[null -> 1]...

有代码。

dropdown_box.dart

    library dropdown_box;

import 'package:angular/angular.dart';
import 'dart:core';
import 'package:tutorial/service/KeyValuePair.dart';
import 'dart:async';


@Component(selector: 'dropdownbox', templateUrl: 'dropdown_box.html', publishAs: 'dropCtrl')
class DropDownComponent {
  // @NgOneWay('items-map')
  // Map<String, String> itemsMap;

  @NgOneWay('items-map')
 List<KeyValuePair> itemsMap;


  @NgTwoWay('selected-keyvalue')
  KeyValuePair selectedKeyValue;

//   void printit(item) {
//    new Future(() {
//      print("${item.value + ' '+ item.key}");
//       SelectedKeyValue = new KeyValuePair(item.key, item.value);
//     });

  String selectedKey;
  void setKeyAsSelected() {

    new Future(() {
      Iterable keyvaluepairs = itemsMap.where((i) => i.key == selectedKey);
      if (keyvaluepairs.length > 0) {
        selectedKeyValue = keyvaluepairs.elementAt(0);
      }
    });

  }

}

dropdown_box.html

<div class=dropdownbox">
  <select ng-model="selectedKey" ng-change="setKeyAsSelected()">
    <option ng-value=""></option>
    <option ng-repeat="item in itemsMap" ng-value="item.key">
     {{item.value}}
      </option>
  </select>
</div>

在recipe_book.html中使用

<dropdownbox items-map="categorieKvList" selected-keyvalue="selectedKV"></dropdownbox>

recipe_book.dart（仅限重要部分）

  KeyValuePair selectedKV;

  List<KeyValuePair> _categorieKvList = new List<KeyValuePair>();
  List<KeyValuePair> get categorieKvList {
    _categorieKvList.clear();
   categories.forEach((f)=>
       _AddToList(f, f));
   return _categorieKvList;
  }

  _AddToList(key, value)
  {
    KeyValuePair kvpair = new KeyValuePair.fromValues(key, value); //new KeyValuePair().AddValues(key, value);
    _categorieKvList.add(kvpair);
  }

keyvaluepair.dart

library KeyValuePair;

import 'package:angular/angular.dart';

@Injectable()
class KeyValuePair {
  dynamic key;
  dynamic value;

//  AddValues(key, value) {
//    this.key = key;
//    this.value = value;
//  }

  KeyValuePair();
  KeyValuePair.fromValues(dynamic this.key, dynamic this.value);
}

Answer 1

categorieKvList的getter每次调用时返回一个更改的_categorieKvList，其中包含新的KeyValu对。这被角度解释为变化。

改变逻辑，因此_categorieKvList仅在其数据源（类别）发生变化时才会被修改。

飞镖 - 模型没有稳定 - 组件

1 个答案: