У меня есть некоторые проблемы. Мне нужно использовать директиву AngularJS, но когда я их создаю, мои NetBeans подчеркивают мою новую директиву и показывают мне ошибку. Вот что у меня есть HTML:Я не могу создать и использовать директиву AngularJS

<!DOCTYPE html> 
<html ng-app="mainModule"> 
    <head> 
     <title>TODO supply a title</title> 
     <meta charset="UTF-8"> 
     <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
     <script type="text/javascript" src="angular.min1.js"></script> 
     <script type="text/javascript" src="app.js"></script> 
    </head> 
    <body ng-controller="mainCtrl"> 
     {{a}} 
     <div><random></random> 
     </div> 
    </body> 
</html>

JavaScript (app.js)

(function(){ 
var app = angular.module("mainModule", []); 
app.controller("mainCtrl", function($scope){ 
        $scope.a = "hi"; 
    }); 
    app.directive("random", function(){ 
     console.log("directive");    
     return { 
      restrict:"E", 
      templateUrl:"random.html" 
     }; 
    }); 
})();

console.log ("директива")

directive 
angular.min1.js:79 XMLHttpRequest cannot load file:///random.html. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.(anonymous function) @ angular.min1.js:79s @ angular.min1.js:74f @ angular.min1.js:72K @ angular.min1.js:102K @ angular.min1.js:102(anonymous function) @ angular.min1.js:103$eval @ angular.min1.js:114$digest @ angular.min1.js:111$apply @ angular.min1.js:114(anonymous function) @ angular.min1.js:18d @ angular.min1.js:35c @ angular.min1.js:18cc @ angular.min1.js:18Xc @ angular.min1.js:17(anonymous function) @ angular.min1.js:217a @ angular.min1.js:146(anonymous function) @ angular.min1.js:31r @ angular.min1.js:7c @ angular.min1.js:31 
angular.min1.js:93 Error: [$compile:tpload] http://errors.angularjs.org/1.2.29/$compile/tpload?p0=%2Frandom.html 
    at Error (native) 
    at file:///home/dimonluk/NetBeansProjects/HTML5Application/public_html/angular.min1.js:6:450 
    at file:///home/dimonluk/NetBeansProjects/HTML5Application/public_html/angular.min1.js:61:425 
    at file:///home/dimonluk/NetBeansProjects/HTML5Application/public_html/angular.min1.js:73:70 
    at w (file:///home/dimonluk/NetBeansProjects/HTML5Application/public_html/angular.min1.js:102:167) 
    at w (file:///home/dimonluk/NetBeansProjects/HTML5Application/public_html/angular.min1.js:102:167) 
    at w (file:///home/dimonluk/NetBeansProjects/HTML5Application/public_html/angular.min1.js:102:167) 
    at file:///home/dimonluk/NetBeansProjects/HTML5Application/public_html/angular.min1.js:103:428 
    at h.$eval (file:///home/dimonluk/NetBeansProjects/HTML5Application/public_html/angular.min1.js:114:32) 
    at h.$digest (file:///home/dimonluk/NetBeansProjects/HTML5Application/public_html/angular.min1.js:111:117)(anonymous function) @ angular.min1.js:93(anonymous function) @ angular.min1.js:68w @ angular.min1.js:102w @ angular.min1.js:102w @ angular.min1.js:102(anonymous function) @ angular.min1.js:103$eval @ angular.min1.js:114$digest @ angular.min1.js:111$apply @ angular.min1.js:114(anonymous function) @ angular.min1.js:18d @ angular.min1.js:35c @ angular.min1.js:18cc @ angular.min1.js:18Xc @ angular.min1.js:17(anonymous function) @ angular.min1.js:217a @ angular.min1.js:146(anonymous function) @ angular.min1.js:31r @ angular.min1.js:7c @ angular.min1.js:31

источник

2016-06-24 Dima Lukashov

Ваш вопрос, кажется, о вашем браузере блокируя доступ к random.html из-за перекрестного происхождения. В качестве первого шага для тестирования, замены templateUrl с шаблоном:

app.directive("random", function(){ 
     console.log("directive");    
     return { 
      restrict:"E", 
      templateUrl:`<h1>random content</h1>` 
     }; 
    });

Если это работает, пожалуйста, объясните, как вы работаете с вашим приложением. Это на локальном хосте? Вы используете tomcat, jboss и т. Д.? Вам нужно будет разрешить перекрестное происхождение (for instance on Tomcat) или сообщить нам, какой URL-адрес вы используете для просмотра своего приложения и random.html (например, localhost: 8080/index.html для приложения и localhost: 8080/random.html?)

У меня есть plunker here for another question, который показывает директивы с использованием шаблона и шаблонаURL.

Дайте нам знать.

источник

2016-06-24 12:35:20 Gregori

Когда я использую 'template:"

Случайный контент

"' Он работает успешно. Я не использую URL. Я открываю его как файл: // ... Может быть, следует попробовать Tomcat или т. Д.? –

Браузер блокирует вас от чтения локального файла по HTTP-запросу. Одним из решений является запуск локального веб-сервера. live-server является популярным, который вы можете включить в gulp, Atom Editor и т. д. Как вы, кажется, используете netbeans, если вы знаете, как развернуть на tomcat, который будет работать, поскольку локальный веб-сервер будет обслуживать ваш файл через URL-адреса, например localhost: 8080/account.html – Gregori

На netbeans, возможно, есть встроенный сервер ... Я нашел это: https://netbeans.org/projects/php/lists/users/archive/2015-01/message/21 – Gregori

Я не могу создать и использовать директиву AngularJS

ответ

Случайный контент

Смежные вопросы