|
|||||||
|
|
|
 |
|
|
Strumenti |
14-04-2016, 23:52
|
#1 | ||
|
Member
Iscritto dal: Nov 2007
Città: Alcamo
Messaggi: 103
|
[Angular.js] Alcuni problemi
Salve a tutti.
Premetto che sto imparando da qualche giorno questo "framework javascript" e non sono ancora espertissimo del pattern MVC... Comunque ho seguito una guida su come installare e configurare tutti gli elementi fondamentali per le angular.js applications [su windows]
Già dopo lo scaffholding ho notato che nonostante sia una procedura del tutto automatizzata il browser mostra le stesse robe della versione di default ma senza elementi stilizzati tramite css (suppongo ci sia un errore nel pacchetto per windows) Tralasciamo questo poichè il css va comunque ricostruito per le proprie esigenze... Provo a generare una mia app molto stupida che preleva dei dati da un file .json (un array di elementi con proprietà "name" e "balance") e me li restituisce in una tabella non formattata ordinandoli per "balance" Quindi ho generato la pagina html iniziale, la index, semplicemente eliminando il contenuto di default all'interno del body e inserendo un tag view con direttiva ng-view=""... index.html Codice:
<body ng-app="myappApp">
<!--[if lte IE 8]>
<p class="browsehappy">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
<![endif]-->
<!-- Add your site or application content here -->
<div ng-view="">
</div>
<!-- Google Analytics: change UA-XXXXX-X to be your site's ID -->
<script>
!function(A,n,g,u,l,a,r){A.GoogleAnalyticsObject=l,A[l]=A[l]||function(){
(A[l].q=A[l].q||[]).push(arguments)},A[l].l=+new Date,a=n.createElement(g),
r=n.getElementsByTagName(g)[0],a.src=u,r.parentNode.insertBefore(a,r)
}(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-XXXXX-X');
ga('send', 'pageview');
</script>
<!-- build:js(.) scripts/vendor.js -->
<!-- bower:js -->
<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/angular-animate/angular-animate.js"></script>
<script src="bower_components/angular-cookies/angular-cookies.js"></script>
<script src="bower_components/angular-resource/angular-resource.js"></script>
<script src="bower_components/angular-route/angular-route.js"></script>
<script src="bower_components/angular-sanitize/angular-sanitize.js"></script>
<script src="bower_components/angular-touch/angular-touch.js"></script>
<!-- endbower -->
<!-- endbuild -->
<!-- build:js({.tmp,app}) scripts/scripts.js -->
<script src="scripts/app.js"></script>
<script src="scripts/controllers/userslist.js"></script>
<!-- endbuild -->
</body>
app.js Codice:
angular
.module('myappApp', [
'ngAnimate',
'ngCookies',
'ngResource',
'ngRoute',
'ngSanitize',
'ngTouch'
])
.config(['$routeProvider', function ($routeProvider) {
$routeProvider
.when('/', {
templateUrl: 'views/users.html',
controller: 'UserslistCtrl',
})
.otherwise({
redirectTo: '/'
});
}] );
Codice:
<table>
<thead>Users</thead>
<tbody>
<tr ng-repeat="user in users | orderBy:balance">
<td>{{ user.name }}</td>
<td>{{ user.balance }}</td>
</tr>
</tbody>
</table>
Codice:
angular.module('myappApp')
.controller('UserslistCtrl',['$scope','$http',function ($scope,$http) {
$http.get('data/users.json')
.success(function (data) {
$scope.users = data;
};
.error(function()){
console.log('Errore');
});
}]);
Codice:
angular.module('myappApp')
.controller('UserslistCtrl',['$scope','$http',function ($scope,$http) {
$http.get('data/users.json')
.then(function (data) {
$scope.users = data;
}, function () {
console.log('Errore');
});
}]);
Codice:
angular.js:13424 SyntaxError: Unexpected token )
at Object.parse (native)
at fromJson (http://localhost:9000/bower_components/angular/angular.js:1285:14)
at defaultHttpResponseTransform (http://localhost:9000/bower_components/angular/angular.js:10305:16)
at http://localhost:9000/bower_components/angular/angular.js:10396:12
at forEach (http://localhost:9000/bower_components/angular/angular.js:321:20)
at transformData (http://localhost:9000/bower_components/angular/angular.js:10395:3)
at transformResponse (http://localhost:9000/bower_components/angular/angular.js:11184:21)
at processQueue (http://localhost:9000/bower_components/angular/angular.js:15757:28)
at http://localhost:9000/bower_components/angular/angular.js:15773:27
at Scope.$eval (http://localhost:9000/bower_components/angular/angular.js:17025:28)(anonymous function) @ angular.js:13424(anonymous function) @ angular.js:10137processQueue @ angular.js:15765(anonymous function) @ angular.js:15773Scope.$eval @ angular.js:17025Scope.$digest @ angular.js:16841Scope.$apply @ angular.js:17133done @ angular.js:11454completeRequest @ angular.js:11652requestLoaded @ angular.js:11593
userslist.js:39 Errore
Codice:
angular.module('myappApp')
.controller('UserslistCtrl',function ($scope) {
$scope.users = [
{
'name' : 'User1',
'balance' : '1200'
},
{
'name' : 'User2',
'balance' : '1270'
},
{
'name' : 'User3',
'balance' : '1140'
},
{
'name' : 'User4',
'balance' : '2070'
}
];
});
chiedo scusa per essermi dilungato
__________________
Notebook: Asus K52J Smartphone: Huawei P8 Lite |
||
|
|
|
21-04-2016, 23:39
|
#2 |
|
Senior Member
Iscritto dal: Nov 2010
Città: Londra
Messaggi: 620
|
console.log(typeof(data))
console.log(data) quando ricevi i dati e vedi cosa stai ricevendo |
|
|
|
|
|
| Strumenti | |
|
|
Tutti gli orari sono GMT +1. Ora sono le: 17:13.
