AngularJS路由和返回时全部重置

时间:2014-11-14 15:48:25

标签: angularjs angularjs-scope

当我点击按钮和AngularJS呼叫路由以加载详细信息页面时。为什么当我回到主页(浏览器上的后退按钮)选择html丢失值的元素和人员列表?谢谢你提前。

这是我的代码:

HTML

<div ng-app>
  <h2>Test</h2>
    <div ng-controller="MainCtrl">
        <select ng-options="people.id as people.name for people in peoples" ng-model="test">
        <option value="">Select People...</option>
        </select>

        <a href="#/details/{{people.id}}" class="btn btn-warning btn-xs"><span class="fa fa-edit"></span> Details</a> 

    </div>
  </div>

控制器:

function MainCtrl($scope) {

 $scope.peoples = [
     {id: '1', name: 'Jon'},
     {id: '2', name: 'Peter'}
   ];



 }

APP.JS:

 App.config(['$routeProvider', function ($routeProvider) {
    $routeProvider          
            .when('/details/:id', {
                templateUrl: configuration.appPartialPath + 'details.html',
                controller: 'DetailsCtrl'
            })

            .otherwise({
                redirectTo: '/'
            });
  }]);

1 个答案:

答案 0 :(得分:0)

Angular中的控制器是按需创建的。当您离开由控制器管理的视图时,它将与其范围一起销毁,并在再次输入相同视图时创建一个新视图。如果您想保留范围数据,则必须将其放在其他地方。

由于Angular服务是单例,因此可以用于此目的。您需要做的就是将这样的服务注入您的控制器并将其绑定到暴露给视图的范围变量。每次创建新控制器时,都会向您注入与您的数据相同的服务。