角：在没有页面重新加载的情况下更新视图

我有一个rootScope json数组，查看的是多个控制器，并在另一个控制器中得到更新。 json数组包含得到更新的url。视图控制器显示大约一半时间的更新URL，但是如果我重新加载页面，我会在100％的时间内获得更新的视图。我试过使用$ scope。$ apply（）和$ timeout，但它们没有区别。
请问有人可以告诉我这里有什么角度的工具吗？我希望有一个简单的方法。角：在没有页面重新加载的情况下更新视图

来源

2016-12-02 user2917629

这是一个包含多种不同可能方法的非常广泛的问题，通过提供更多细节或代码尝试更具体。 – svarog

您是否尝试过使用ngView和ngRoute？实际提供的文件不会改变，您的视图会在ngView中填充以改变用户看到的内容（以及URL）。它看起来像页面已经导航，但它没有，所以$ rootScope被保留。 –

@DominicAquilina：ngView和ngRoute都可以相互结合使用来实现我所追求的目标？或者我会使用其中一个还是另一个？到目前为止，我一直只使用控制器和服务来共享功能。 – user2917629

去了我先前的评论的：

指数

<!doctype html> 
<html ng-app="myapp"> 
    <head> 
    <!--Head stuff--> 
    </head> 

    <body> 
    <div ng-view=""></div> 

    <!-- Scripts, other stuff --> 
    </body> 
</html>

主脚本

'use strict'; 

angular 
.module('myapp', [ 
    //... 
    'ngRoute', 
    //... 
    ]) 
.config(function (..., $routeProvider, ...) { 
    $routeProvider 
    .when('/404', { 
     templateurl: '404.html', 
     controller: 'ErrorCtrl', 
     controllerAs: 'errorCtrl', 
     title: 'You are lost' 
    }) 
    .when('/', { 
     templateUrl: 'views/home.html', 
     controller: 'HomeCtrl', 
     controllerAs: 'homeCtrl', 
     title: 'Home' 
    }) 
    .when('/contact', { 
     templateUrl: 'views/contact.html', 
     controller: 'ContactCtrl', 
     controllerAs: 'contactCtrl', 
     title: 'Contact Us' 
    }) 
    .otherwise({ 
     redirectTo: '/404' 
    }); 

    //... 
}) 
.run (function (...) { 
    //... 
});

使用

<a href="/contact">Contact Us</a>

您将采用所有页面通用的基本模板代码，并将其包含在索引中。基本上，不变的东西总是在那里。否则，请将其从主页面中取出，并将其放入带有其自己的控制器的模板文件中。或者，拥有一些共享控制器，并将视图用作模板，然后将所有功能铲入指令。我其实更喜欢后一种方法，但前者如上所示。

这个解决方案值得注意的是该页面实际上只加载一次。由于您在导航到不同视图时始终保持索引，因此只需从服务器获取新模板的HTML并将其注入到视图中（ngRoute负责）。我相信默认情况下，您的网址中会有一个#，因此您可能需要启用HTML5模式。 $locationProvider到你的配置功能，然后添加这一行：

$locationProvider.html5Mode ({ enabled: true });

你也需要一个基地添加到您的索引文件的头部元素：

<base href="/" />

作业： Routes tutorial，HTML5 mode

如果您使用Grunt ，你可能也想看看ngTemplates。它可以真正提高性能。

来源

2016-12-02 22:23:14

角：在没有页面重新加载的情况下更新视图

回答

相关问题