angular.dart seems to be slow

问题

I am trying angular.dart and saw that its slow. When am html page is loaded containing angular, angular directive is seen first, which are then converted appropriately. Shouldn't it be converted instantaneously and the user should not see whether we are using angular ?

<!DOCTYPE html>
<html ng-app>
<head>
    <title>Hello, World!</title>
</head>
<body>

  <h3>Hello {{name}}!</h3>
  name: <input type="text" ng-model="name">

  <script type="application/dart" src="main.dart"></script>
  <script type="text/javascript" src="packages/browser/dart.js"></script>
</body>
</html>

回答1:

Surround {{name}} with a tag having class="ng-cloak". I used span tag. Keep it hidden by specifying css rule .ng-cloak{ display:none; }. When angular is loaded, it will remove class="ng-cloak" from the span tag and everything will work as expected.

<!DOCTYPE html>
<html ng-app>
<head>
    <title>Hello, World!</title>
    <style>
      .ng-cloak{ display:none;}
    </style>
</head>
<body>
  <h3>Hello <span class="ng-cloak">{{name}}</span>!</h3> 
  name: <input type="text" ng-model="name">  

  <script type="application/dart" src="main.dart"></script>
</body>
</html>

回答2:

An alternative way is to use ng-bind as demonstrated in this youtube video: AngularJS MTV Meetup: Best Practices (2012/12/11) (after about 12 minutes)

Quoted from the API doc of NgBindDirective class

Typically, you don't use ngBind directly, but instead you use the double curly markup like {{ expression }} which is similar but less verbose.

It is preferrable to use ngBind instead of {{ expression }} when a template is momentarily displayed by the browser in its raw state before Angular compiles it. Since ngBind is an element attribute, it makes the bindings invisible to the user while the page is loading.

This way you can display default content that get's replaced when Angular is ready instead of showing a blank page or a progress icon.

来源：https://stackoverflow.com/questions/20558316/angular-dart-seems-to-be-slow

标签

dart

angular-dart