2014-06-19 2 views
0

나는 사용자가 제어 할 수있는 HTML 섹션을 가지고 있지만 특정 요소를 클릭해야합니다. html의 일반적인 구조는 각 페이지에 대해 li이있는 ul이 될 것이며, ul은 각 하위 페이지에 대해 다른 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> 

내가 페이지 후이 작업을 수행 할 수는로드와 각도가 이미 부트 스트랩 어떻게? 일반적으로 솔루션은이를 대체하는 앵커 태그에 대한 지시문을 작성하는 것이지만 사용자가 설정 한대로 유지하려면 앵커 태그의 텍스트가 필요합니다. 동일한 것으로 유지하려면 href가 필요합니다. 이 섹션 내의 앵커 태그에만 영향을줍니다. 상위 ul 태그 외부에 앵커 태그를 적용 할 수 없습니다.


간단히 말해, 아무것도 속성?

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

답변

1

겠습니까이 작품을 추가 할 jQuery를 사용하는 것과 비슷 있는가? http://plnkr.co/edit/vxowNUAnbQSkuiHpNvYZ

href 속성을 비워두면 각도가 기본값이됩니다.

응용 프로그램이 부트 스트랩 된 후에 위 예제에서 jQuery를 실행할 응용 프로그램의 동일한 지점에서 모델의 "options"컬렉션을 채울 수 있습니다.

당신의 생각을 알려주세요.

1

이 게시물의 영향을받을 수 있습니다 : How to think Angular with a jQuery background.

일반적으로 ng-click과 같은 것을 무시하고 싶지는 않습니다. 일반적으로 디자인 문제를 나타내며 대부분의 경우 제대로 작동하지 않습니다.

은 당신이 아마 여기에 원하는 것은, 예를 들어, class="menu-link"directive입니다 :

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; 
     }); 
    } 
    }); 
+0

그래서 jQuery를 통해'클래스 = "메뉴 링크를"'추가 할 수 있습니다과에 지침의 링크 기능을 사용하여 개체를 조작? – EmmaGamma

+0

메뉴에 항목을 동적으로 추가해야합니까? – Ven

+0

페이지가로드되면 한 번만. – EmmaGamma

관련 문제