被重新加载

Question

停止公共模板我有一个角度应用程序依赖角UI的路由器上。此应用程序共享一个通用模板，如导航栏多个页面：

var app = angular.module('app', ['ngSanitize', 'ngResource', 'ngRoute', 'ui.router']) 
    .config(['$urlRouterProvider', '$stateProvider', ($urlRouterProvider, $stateProvider) => { 
     $urlRouterProvider.otherwise("/index"); 

     $stateProvider 
      .state('index', { 
       url: "/index", 
       views: { 
        'navbar': { 
         templateUrl: 'Views/Partials/navbar.cshtml', 
         controller: 'App.Controllers.NavbarController' 
        }, 
        'content': { 
         templateUrl: 'Views/index.cshtml', 
         controller: 'App.Controllers.IndexController' 
        } 
       } 
      }) 
      .state('settings', { 
       url: "/settings", 
       views: { 
        'navbar': { 
         templateUrl: 'Views/Partials/navbar.cshtml', 
         controller: 'App.Controllers.NavbarController' 
        }, 
        'content': { 
         templateUrl: 'Views/settings.cshtml', 
         controller: 'App.Controllers.SettingsController' 
        } 
       } 
      }); 
    }]); 

两个'/index'和'/settings'共享相同的模板'Views/Partials/navbar.cshtml'。在测试时，我发现，每一个“页”加载一个URL时，在它所有的意见都重新加载。

是否有可能避免重装导航栏，如果先前已装了吗？

Answer 1

你应该能够导航栏提取到现有状态的父状态。这样，当进入双亲状态，你应该能够改变共享此父子状态，而不会影响其导航栏只加载。

虽然有更好的组织方式来做到这一点，我的快速和肮脏的方法是你有状态重命名为withnav.index和withnav.settings。然后从它们中删除导航栏视图并添加以下状态。

$stateProvider 
    .state('withnav', { 
     abstract: true, 
     views: { 
      'navbar': { 
       templateUrl: 'Views/Partials/navbar.cshtml', 
       controller: 'App.Controllers.NavbarController' 
      } 
     } 
    });