如何获取路线以使用AngularDart？

问题描述

这是我的代码，

  import'package：angular / angular.dart' 
 
 class AppModule extends Module {
 
 AppModule（）{
 type（AppController）; 
 type（LoginController）; 
 type（RouteInitializer，implementedBy：AppRouter）; 
} 
 
} 
 
类AppRouter实现RouteInitializer {
 
 init（路由器路由器，ViewFactory视图）{
路由器。 root 
 ..addRoute（
 name：'login'，
 path：'/ login'，
 enter：view（'app / views / login.tpl.html'） ）
 ..addRoute（
 defaultRoute：true，
 name：'index'，
 enter：view（'app / views / index.tpl.html'））; 
} 
 
} 
 
 @NgController（selector：'[app-ctrl]'，publishAs：'ctrl'）
 class AppController {
 
} 
 
 @NgController（selector：'[login-ctrl]'，publishAs：'ctrl'）
 class LoginController {
 
 Http _http; 
 String works ='Works。'; 
 
 LoginController（this._http）; 
 
} 
  

没有路由可用，点击'＃/ login 链接不会更改网址或视图。

日志

  clicked /app/web/index.html#/login 
 route /app/web/index.html [Route：null] 
 route [Route：index] 
  
 
 
 
我做错了什么？
解决方案
 p>这段代码可能有几个问题。从我可以看到最可能的问题是路由使用pushState。当你使用pushState时，你不使用哈希操作url。有关详情，请参阅：
  
 
 
 
当浏览器支持时，Angular将使用推送状态。
  bind（NgRoutingUsePushState，toValue：new NgRoutingUsePushState.value（false））; 
  
给你的模块：
  class AppModule extends Module {
 
 AppModule（）{
 bind（AppController）; 
 bind（LoginController）; 
 bind（RouteInitializer，implementedBy：AppRouter）; 
 bind（NgRoutingUsePushState，toValue：new NgRoutingUsePushState.value（false））; 
} 
} 
  
其他可能的问题包括：
 
 
 
 
 
没有ng-view指令
 
 
不在app / views / login.tpl中设置ng-bind- .html和app / views / index.tpl.html 
 
 
 
 
 
当我进行所有这些更改时，到＃/ login 
 
This is my code,
import 'package:angular/angular.dart';

class AppModule extends Module {

  AppModule(){
    type(AppController);
    type(LoginController);
    type(RouteInitializer, implementedBy: AppRouter);
  }

}

class AppRouter implements RouteInitializer {

  init(Router router, ViewFactory view) {
   router.root
    ..addRoute(
      name: 'login',
      path: '/login',
      enter: view('app/views/login.tpl.html'))
    ..addRoute(
       defaultRoute: true,
       name: 'index',
       enter: view('app/views/index.tpl.html'));
  }

}

@NgController(selector: '[app-ctrl]', publishAs: 'ctrl')
class AppController {

}

@NgController(selector: '[login-ctrl]', publishAs: 'ctrl')
class LoginController {

  Http _http;
  String works = 'Works.';

  LoginController(this._http);

}
No routes are working, clicking on a '#/login' link does not change the url or the view.
Log says
clicked /app/web/index.html#/login
route /app/web/index.html [Route: null]
route  [Route: index]
What am I doing wrong?
 解决方案 
There might be a couple of problems with this code. From what I can see the most likely problem is that the routing is using pushState. When you use pushState you don't manipulate the url using a hash. For more information on that see:Manipulating Browser History
Angular will use push state when a browser supports it.
bind(NgRoutingUsePushState, toValue: new NgRoutingUsePushState.value(false));
Giving you are module of:
class AppModule extends Module {

  AppModule(){
    bind(AppController);
    bind(LoginController);
    bind(RouteInitializer, implementedBy: AppRouter);
    bind(NgRoutingUsePushState, toValue: new NgRoutingUsePushState.value(false));
  }
}
Other possible problems include:
Not having an ng-view directive
Not setting the ng-bind-route in app/views/login.tpl.html, and app/views/index.tpl.html
When I made all these changes your code worked correctly for me when navigating to #/login
                        
这篇关于如何获取路线以使用AngularDart？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！