角度和语义标记/关注点分离

也许这不是问这个问题的好地方，但我会尽力使它尽可能客观和负责任。

我一直在玩Angular.js并非常喜欢它，但是我对它的哲学有疑问。这是Angular站点中控制器的一小段代码。

   <div ng-controller="TodoCtrl">
      <span>{{remaining()}} of {{todos.length}} remaining</span>
      [ <a href="" ng-click="archive()">archive</a> ]
      <ul class="unstyled">
        <li ng-repeat="todo in todos">
          <input type="checkbox" ng-model="todo.done">
          <span class="done-{{todo.done}}">{{todo.text}}</span>
        </li>
      </ul>
      <form ng-submit="addTodo()">
        <input type="text" ng-model="todoText"  size="30"
               placeholder="add new todo here">
        <input class="btn-primary" type="submit" value="add">
      </form>
    </div>

这基本上是HTML在Angular指令中添加的。我发现可能有疑问的一个是：<a href="" ng-click="archive()">archive</a>。

当Jeffrey Zeldman撰写Designing With Web Standards时，将标记（HTML），表示（CSS）和交互（JS）分离到不同文件中以实现可维护性成为了最佳实践。

我的问题是，Angular如何不违反它？我实际上真的很喜欢它，并且发现它非常强大，但是将click事件绑定到a标记中的元素与编写此标准Web前标准代码的痕迹之间有什么区别：

<a href='#' onClick='showAlert()'>Click here</a>

<script>
    var showAlert = function(){
      alert('hey');
    }
</script>

有用的答案除了使用框架的个人经验外，还可能参考文档。