$ scope bricht AngularJS Portletanwendung

Question

Ich versuche AngularJS zu bekommen in meiner .jsp Seite mit dem einfachstenen App direkt von W3s kopiert läuft example

UPDATE: Ich versuche Winkel zu verwenden, in einem Liferay Portlet , so ist hier das Ausmaß meines Codes in view.jsp

<% 
/** 
* Copyright (c) 2000-present Liferay, Inc. All rights reserved. 
*/ 
%> 

<%@ taglib uri="http://java.sun.com/portlet_2_0" prefix="portlet" %> 

<portlet:defineObjects /> 

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script> 

<div ng-app="myApp" ng-controller="myCtrl"> 

First Name: <input type="text" ng-model="firstName"><br> 
Last Name: <input type="text" ng-model="lastName"><br> 
<br> 
Full Name: {{firstName + " " + lastName}} 

</div> 

<script type='text/javascript'> 
    var app = angular.module('myApp', []); 
    app.controller('myCtrl', function($scope) { 
     $scope.firstName = "John"; 
     $scope.lastName = "Doe"; 
    }); 
</script> 

aber sobald ich mein Objekt Controller + $ Umfang zu nutzen versuchen, die App-Pausen und erhalte ich die Fehler

Failed to instantiate module myApp due to: 
Error: [$injector:modulerr] http://errors.angularjs.org/1.5.6/$injector/modulerr?p0=n...) 
    at Error (native) 
    at https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js:6:412 
    at https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js:40:134 
    at q (https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js:7:355) 
    at g (https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js:39:222) 
    at https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js:39:391 
    at q (https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js:7:355) 
    at g (https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js:39:222) 
    at db (https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js:43:246) 
    at Ac.c (https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js:21:19 

Ich kann nicht herausfinden, warum das so ist. Irgendwelche Ideen?

Answer 1

Aus irgendeinem Grund sieht Ihr Fehler so aus, als ob der Code denkt, dass Sie versuchen, 'a' zu injizieren.

Wenn möglich, empfehle ich Ihnen diese in einem separaten Skript setzen, und wickeln in einem IIFE:

app.js:

(function(){ 
    var app = angular.module('myApp', []); 
    app.controller('myCtrl', function($scope) { 
     $scope.firstName = "John"; 
     $scope.lastName = "Doe"; 
    }); 
})(); 

Und dann ist es in Ihrem HTML sind:

<script src="app.js"></script>