这是我的装饰器:

@Decorator(selector: '[navbaractivator]')
class NavbarActivator {
final _logger = new Logger('webapp_base_ui.sample.flexbox.navbaractivator');

final Scope _scope;
final Router _router;

  NavbarActivator(this._scope, this._router) {
  _logger.info("NavbarActivator");

  _scope.watch( _router.activePath,(value, previousValue) {
      _logger.info("Changed");
  },collection: true);
}
}

这是对应的HTML代码段:

Navigation


    
Home

    
Second

    
Third

    
JS-Version

“已更改”消息仅在重新加载页面后出现，而在更改 View 后不会出现...
请帮助-thx

[ làm mới]

我现在正在使用_router.onRouteStart.listen。在下面的我的答案中有更多详细信息

1 Câu trả lời

我现在有一个很好的解决方案:
工作样本(编译为JS):http://samples.mikemitterer.at/example/flexbox/fbangular.html

HTML:

    
    
    
Home
        

            
Submenu

        

    

    
Second


    
    
Third

    
JS-Version

我的装饰:

@Decorator(selector: '[navbaractivator]')
class NavbarActivator {
    final _logger = new Logger('webapp_base_ui.sample.flexbox.navbaractivator');

    static const String _classToChange = "active";
    static const String _dataAttribute = "data-route";

    final Router _router;
    final html.Element _element;
    String _routeToCheck;

    NavbarActivator(this._element, this._router) {
        _logger.fine("NavbarActivator");

        _routeToCheck = _element.getAttribute(_dataAttribute);
        _logger.fine("Route-Name: to check: ${_routeToCheck}");

        _addListener(compareAttribute: (_routeToCheck != null && _routeToCheck.isNotEmpty));
    }

    //--------------------------------------------------------------------------------
    // private

    String _route() {
        final List names = new List();
        _router.activePath.forEach((final Route element) {
            names.add(element.name);
        });
        return names.join("/");
    }

    void _addListener({final bool compareAttribute }) {
        _router.onRouteStart.listen((final RouteStartEvent event) {
            event.completed.then((final bool success) {
                if (success) {
                    final String route = _route();

                    Function check = () => _compareRoutePath();
                    if(!compareAttribute) {
                        check = () => _compareFragment(event.uri);
                    }

                    if(check()) {
                        _element.classes.add(_classToChange);
                    } khác {
                        _element.classes.remove(_classToChange);
                    }
                }
            });
        });
    }

    bool _compareRoutePath() {
        final String route = _route();

        _logger.fine("Changed, Route-Name to check: ${_routeToCheck}, Route-Name: $route");
        return (_routeToCheck == route);
    }

    bool _compareFragment(final String uri) {
        _logger.fine("Changed, Uri: ${uri}");

        final html.AnchorElement anchor = (_element.querySelector("a") as html.AnchorElement);
        if (anchor != null && anchor.href != null && anchor.href.indexOf("#") != -1) {
            thử {
                final String fragment = anchor.href.substring(anchor.href.indexOf("#") + 1);
                _logger.fine(" -> Fragment: ${fragment}, Route-Name: ${_route()}, Uri: $uri");
                if (fragment == uri) {
                    trả về giá trị đúng;
                }
            }
            on RangeError
            catch(e) {
                _logger.fine("No fragment in ${anchor.href}");
            }
        }
        trả về false;
    }
}

这是路由器:

void myRouteInitializer(Router router, RouteViewFactory view) {

    router.root
        ..addRoute(

            name: "first",
            path: "/first",
            //enter: view("views/first.html"),
            defaultRoute: true,

            mount: (Route route) => route
                ..addRoute(
                    defaultRoute: true,
                    name: 'first',
                    path: '/all',
                    enter: view('views/first.html'))
                ..addRoute(
                    name: 'firstsub',
                    path: '/sub',
                    enter: view('views/firstsub.html'))
        )
        ..addRoute(
            name: "second",
            path: "/second",
            enter: view("views/second.html")
        )
        ..addRoute(
           name: "third",
            path: "/third",
            enter: view("views/third.html")
    );
}

关于dart - 装饰器(范围)/监视功能未调用，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/23470484/