javascript - Beginner in Angular. What's wrong? -
i'm following tutorial in youtube...i believe did correct, it's refuses work...on video @ youtube it's works charme, can't make works locally. clue ? there no error or result on screen. it's blank page.
in controller.js...
var demoapp = angular.module('demoapp',[]); //routes demoapp.config(function ($routeprovider){ $routeprovider .when('/view1', { controller : 'simplecontroller', templateurl : 'view1.html' }) .otherwise('/', { redirectto : '/view1' }); }); //controllers demoapp.controller('simplecontroller' , function ($scope) { $scope.familyarray = [ { name : 'me ', city : 'london'}, {name : 'wife', city : 'st. matheus'}, {name : 'son', city : 'ipswich'} ]; });
in index.html. i've...
<!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" data-ng-app="demoapp"> <head> <meta content="text/html; charset=utf-8" http-equiv="content-type" /> <title>my title</title> </head> <body> <div> <div data-ng-view=""> </div> </div> <script src="./css_and_js/angular.min.js"></script> <script src="./css_and_js/controller.js"></script> </body>
..and last, view1.html...
<div class="container"> name:<br> <input type="text" data-ng-model=filter."nameinput"><br><br> hello, {{name}} <ul> <li data-ng-repeat="data in familyarray | filter : filter.nameinput | orderby: 'city'">{{data.name}} - {{data.city | lowercase}}</li> </ul> add name : <br> <input type="text" data-ng-model="new.name"> <br> </ul> add city : <br> <input type="text" data-ng-model="new.city"> <br> <a href="#/view2">view 2</a>
also, i've no idea how debug it...on chrome console, it's show : uncaught object @ angular.min.js:6
update...after receive suggestions change code...actually i'm facing blank page result no error message on console. let me update code:
controller.js: var demoapp = angular.module('demoapp',['ngroute']); //routes demoapp.config(function ($routeprovider){ $routeprovider .when('/view1', { controller : 'simplecontroller', templateurl : 'view1.html' }) .otherwise('/', { redirectto : '/view1' }); }); //controllers demoapp.controller('simplecontroller' , function ($scope) { $scope.familyarray = [ { name : 'marco jr', city : 'london'}, {name : 'rosana valkovics', city : 'são matheus'}, {name : 'fernando valkovics', city : 'ipswich'} ]; });
my view1.html:
`<div class="container"> name:<br> <input type="text" data-ng-model="filter.nameinput"><br><br> hello, {{name}} <ul> <li data-ng-repeat="data in familyarray | filter : filter.nameinput | orderby: 'city'">{{data.name}} - {{data.city | lowercase}}</li> </ul> add name : <br> <input type="text" data-ng-model="new.name"> <br> </ul> add city : <br> <input type="text" data-ng-model="new.city"> <br> <a href="#/view2">view 2</a> </div>`
my index.html: no changes.
actually there no exceptions, i'm still facing blank page :(
angular works html5. have wrong doctype. need:
<!doctype html>
also, take xmlns="http://www.w3.org/1999/xhtml"
out of html tag.
regarding debugging, should never use minified version of debugging.
Comments
Post a Comment