如何在发生位置更改时更新UI?

时间:2015-06-26 15:43:51

标签: angularjs

我正在尝试实现位于我的网络应用程序顶部的导航栏。该导航栏包含您所在位置的选项卡。 (I.E.'home'='/ home','settings'='/ settings'等)如何在更改URL后更新UI以表示它们所处的选项卡?

要确定应用中的路线,请输入以下代码:

app.config(['$routeProvider',
  function($routeProvider) {
  $routeProvider.
    when('/home', {
      templateUrl: 'partials/home.html',
      controller: 'homeCtrl'
    }).
    when('/projects', {
      templateUrl: 'partials/projects.html',
      controller: 'projectsCtrl'
    }).
    when('/about', {
      templateUrl: 'partials/about.html',
      controller: 'aboutCtrl'
    }).
    when('/contact', {
      templateUrl: 'partials/contact.html',
      controller: 'contactCtrl'
    }).
    otherwise({
      redirectTo: '/home'
    });
}]);

1 个答案:

答案 0 :(得分:1)

如果您只想快速实现,我可能会建议在您的html模板中添加{{title}}之类的内容,并配置和使用$ rootScope.title从每个控制器更新此值。

实现将是这样的,加上模板的更新。

from pyspark.sql.window import Window

(testDF
 .select("k", "v",
         F.rowNumber()
         .over(Window
               .partitionBy("k")
               .orderBy("k")
              )
         .alias("rowNum")
        )
 .show()
)

+----+-------+------+
|   k|      v|rowNum|
+----+-------+------+
|key1|[1,2,3]|     1|
|key1|[1,4,7]|     2|
|key1|[2,2,3]|     3|
|key2|[5,5,5]|     1|
|key2|[5,5,9]|     2|
|key2|[7,5,5]|     3|
+----+-------+------+

但我认为更好的方法实际上是为导航栏创建一个状态,并使每个当前状态成为导航状态的不同子状态。由于范围继承,您可以在任何嵌套子状态中访问导航状态$ scope.title。

这是一个学习如何运作的好地方。

https://github.com/angular-ui/ui-router/wiki/Nested-States-%26-Nested-Views#inherited-custom-data