Page 438 - AngularJS权威教程

418 第 31 章 构建 Angular Chrome 应用

图31-11 在浏览器中自动填充

31.13 添加时区支持

最后，我们还希望能够根据用户在他的设置中的选择来更新时钟和显示新地址。要更新时钟
包含时区支持很容易：实际上我们已经通过自动完成API实现了最难的部分。
首先，必须给指令再添加一个用作时区的timezone属性：

<input type="text" ng-model="user.location" timezone="user.timezone" auto-fill="fetchCities"
autocomplete="off" placeholder="Location" />

接下来，需要在指令的compile函数中将timezone属性添加给生成的<input>字段：
// ...
input.attr('type', tAttrs.type);
input.attr('ng-model', tAttrs.ngModel);
input.attr('timezone', tAttrs.timezone);
tEle.replaceWith(tplEl);
// ...
最后一项要点，在处理自动完成的链接函数中，还要在保存用户位置值时保存用户的时区：
// ...
scope.reslist = data;
scope.ngModel = data[0].zmw;
scope.timezone = data[0].tz;
// ...
回到浏览器中，当用户输入城市时，会看到我们在新的城市值旁边保存了时区信息，如图
31-12所示。