在angular引导之后添加angular属性

Adding angular attributes after angular bootstraps

本文关键字：angular 添加 属性 之后      更新时间：2023-09-26

我有一个部分的HTML，用户将在控制，但我需要给某些元素一个ng-click。我知道html的一般结构将是每个页面的ul和li，并且ul内部的li和其他每个子页面的li。但这将完全由用户控制，我不能直接触摸HTML。

说某人创建了:

<ul>
  <li><a href="#home">Home</a></li>
  <li><a href="#about">About</a></li>
  <li><a href="#blog">Blog</a></li>
  <li><a href="#contact">Contact</a></li>
</ul>

，我想把它变成:

<ul>
  <li><a ng-click="$event.preventDefault(); openPage($event.target)" href="#home">Home</a></li>
  <li><a ng-click="$event.preventDefault(); openPage($event.target)" href="#about">About</a></li>
  <li><a ng-click="$event.preventDefault(); openPage($event.target)" href="#blog">Blog</a></li>
  <li><a ng-click="$event.preventDefault(); openPage($event.target)" href="#contact">Contact</a></li>
</ul>

在页面已经加载并且angular已经启动之后，我该怎么做呢?我知道，通常情况下，解决方案是创建一个指令的锚标记，取代他们，但我需要锚标记中的文本保持任何用户设置，我需要href保持不变，我需要它只影响本节内的锚标记。它不能影响父ul标记之外的任何锚标记。

简单地说，是否有类似的使用jquery添加属性?: 

$('ul').find('a').attr('ng-click', '$event.preventDefault(); openPage($event.target)');

这样行吗?http://plnkr.co/edit/vxowNUAnbQSkuiHpNvYZ

让href属性为空可以防止angular中出现默认值。

应用程序启动后，你可以在你的应用程序中运行jQuery的同一点在你的模型中填充"options"集合

你可能会对这篇文章感兴趣:如何在jQuery背景下思考Angular。

你通常不想重写ng-click之类的东西。这通常表明一个设计问题，在大多数情况下不会成功。

你可能想要的是一个指令，例如，class="menu-link":

angular.module('foomodule', [])
  .directive('menuLink', {
    restrict: 'C', // C for class
    link: function (scope, element, attributes, parentController) {
      element.on('click', function () {
        scope.openPage(element.attr('href'));
        return false;
      });
    }
  });
相关文章：