각도가 간단한 지시문이 작동하지 않습니다.

저는 새로운 각도이며 매우 흥분됩니다. 지시어에 최상위 naviagtion을 넣으려고하므로 1) resuable 2) 내 html을 읽기 쉽게 만들기각도가 간단한 지시문이 작동하지 않습니다.

그러나 topMenu 지시어를 사용하면 나에게 맞지 않을 수 있습니다. 내 피들을 쳐다 보면서 내가 뭘 잘못하고 있는지 볼 수 있습니까? 감사합니다 만, 메신저 여기

내 menu.js 여기

//define menu controller 
var menu = angular.module('MenuApp', []) 
    menu.controller('MenuCtrl', [function() { 
     var self = this; 
     self.active= '1'; 
     self.navigation = [ 
    { 
     menutext:"Home", 
     url:"#/" 
    }, 
    { 
     menutext:"About App", 
     url: "#/aboutapp", 
     submenu:[ 
     { 
      menutext:"Pricing", 
      url: "#/pricing" 
     } 
     ] 
    } 
    ]; 

    }]); 

menu.directive('topMenu', function() { 
    return { 
    restrict: 'E', 
    template: '<h2>test</h2>' 
    }; 
});

파일입니다 롤 내 머리를 잃고 내 인덱스 문제는 주로 장소 곳입니다

<!DOCTYPE html> 
<html> 
<head> 
<title>Fit Bit App</title> 
<meta name="viewport" content="width=device-width, initial-scale=1"> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script> 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.9/angular.min.js"></script> 
<link href="css/default.css" rel="stylesheet"> 
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script> 
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" rel="stylesheet"> 
<script src ="app/controllers/menu.js"></script> 
</head> 

<body ng-app="MenuApp"> 
<header> 
    <nav class="navbar navbar-inverse" data-ng-controller = "MenuCtrl as menuCtrl"> 
     <div class="container-fluid"> 
     <div class="navbar-header"> 
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar"> 
      <span class="icon-bar"></span> 
      <span class="icon-bar"></span> 
      <span class="icon-bar"></span> 
      </button> 
      <a class="navbar-brand" href="#">WebSiteName</a> 
     </div> 
     <div class="collapse navbar-collapse" id="myNavbar"> 
      <ul class="nav navbar-nav" data-ng-repeat = "menuitem in menuCtrl.navigation"> 
      <li ng-if="!menuitem.submenu"><a href={{menutext.url}}>{{menuitem.menutext}}</a></li> 
      <li class="dropdown" ng-if="menuitem.submenu"><a class="dropdown-toggle" data-toggle="dropdown" href="#">{{menuitem.menutext}}<span class="caret"></span></a> 
       <ul class="dropdown-menu"> 
        <li data-ng-repeat = "submenu in menuitem.submenu"><a href={{submenu.url}}>{{submenu.menutext}}</a></li> 
       </ul> 
      </li> 
      </ul> 
      <ul class="nav navbar-nav navbar-right"> 
      <li><a href="#"><span class="glyphicon glyphicon-user"></span> Sign Up</a></li> 
      <li><a href="#"><span class="glyphicon glyphicon-log-in"></span> Login</a></li> 
      </ul> 
     </div> 
     </div> 
    </nav> 

</header> 

<div><top-menu></top-menu></div> 

</body> 
</html>

출처

2015-01-19 Brandon Braner

jsfiddle에서 본문 또는 머리글 옵션에 scipt를로드해야합니다. http://jsfiddle.net/jL8mq5hc/. 즉. 왼쪽 패널 드롭 다운 "포장 없음". 그렇지 않으면'load' 옵션을 사용하여 문서로드에 스크립트를로드하게됩니다. – PSL

입니다 당신은 앱과 컨트롤러를 등록합니다. 귀하의 바이올린에서 onLoad 옵션을 사용하고 있기 때문에 jsfiddle은 window.onload 안에있는 스크립트 패널에서 스크립트를로드합니다. 각도가지시문을 html로 찾을 때 응용 프로그램을 부트 스트랩하려고하면 발생합니다. onLoad 옵션을 사용하는 대신 wrap in body (또는 헤드) 옵션을 사용하여 스크립트 패널의 스크립트가 미리 실행되도록 미리 각도가 귀하의 앱 MenuApp을 인스턴스화합니다. Working Fiddle

출처

2015-01-19 01:50:43 PSL

이제 저는 정말로 혼란 스럽습니다. 그것은 내 서버에로드 내 일반적인 애플 리케이션에서 바이올린에 작동하지만, 지시문을로드하지 않습니다. 어떤 아이디어가 코드를 기반으로 잘못된 것일까 요? –

실제 시나리오에서 무엇을하고 있는지 모른 채 말할 수 없습니다. 또한 콘솔의 오류도 살펴 봐야합니다. – PSL

콘솔에 오류 메시지가 표시되지 않고 2 초 정도 걸리면 github으로 푸시됩니다. 너무 단순해서 시간 낭비했습니다. https://github.com/blbraner/fitbitapp –

각도가 간단한 지시문이 작동하지 않습니다.

답변

관련 문제