Question

我有一种情况，我已经简化为以下小提琴：

HTML：

<a href="#/">Tab 1</a> |
<a href="#/2">Tab 2</a>
<hr>
<div ng-view></div>

JS：

var myApp = angular.module('myApp',[]);

myApp.config(['$routeProvider',
  function($routeProvider) {
    $routeProvider.
      when('/', {
        template: 'Tab 1<br><input-directive></input-directive>'
      }).
      when('2', {
        template: 'Tab 2'
      });
  }]);

myApp.directive('inputDirective', function($http) {
    return {
        restrict:"E",
        template:'<input type="text" ng-model="text">'
    }
});

有一系列标签链接到使用ng-route管理的不同角度网址。

第一个选项卡的视图内部是一个带有输入字段的指令。我遇到的问题是当你导航到选项卡2时，标签1的指令中的输入被遗忘（因为当视图改变时，指令会调用$ scope。$ destroy（））。

防止这种情况发生的最佳方法是什么，这样当您导航回选项卡1时，您输入的任何文字都会被记住？

如果有必要，我很乐意考虑一种完全不同的方法。

Answer 1

好的，经过一番深入研究后，我想我已经找到了解决方案。

我认为，曾经的解决方案是将模型缓存在单例服务中，但幸运的是，有一个很好的插件可用作ui-router-extras的一部分，称为粘滞状态：

http://christopherthielen.github.io/ui-router-extras/#/sticky

Angular JS - 记住视图更改时的视图输入内容

1 个答案: