my code my controller:
App.controller('TestCtrl', function ($scope, $http) {
console.log("CTRL STARTED");
if (angular.isDefined($scope.test)) <--------------- ERROR
{
alert('UNDEFINITA');
LoadDefault();
};
My HTML
<select class="form-control" ng-options="people.id as people.name for people in peoples" ng-model="test" ng-change="LoadAnotherSelect()">
<option value="">Seleziona azienda...</option>
</select>
How to know if test variable is undefined????
Thank's in advanced
your code seems fine,
what error are you getting?
as you can see, this code works, using angular.isDefined($scope.name):
var app = angular.module('plunker', []);
app.controller('MainCtrl', function($scope) {
$scope.name = 'World';
if (angular.isDefined($scope.name)) {
alert($scope.name);
}
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<!DOCTYPE html>
<html ng-app="plunker">
<head>
<meta charset="utf-8" />
<title>AngularJS Plunker</title>
<script src="app.js"></script>
</head>
<body ng-controller="MainCtrl">
</body>
</html>
Related
I'm going through a basic book for Angular, and it uses a controller to set up a field. However, I don't get the expected output. Searching here and elsewhere, it looks like I'm invoking it correctly, but something's not working. Anything obviously wrong? Anything else to try? Details below. Thanks.
Document html:
<html lang="en" ng-app ng-controller="AppCtrl">
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="css/bootstrap.min.css">
<title></title>
<script src="js/angular.min.js"></script>
<script type="text/javascript" src="js/controller.js"></script>
</head>
<body>
<h1>Hello, {{name || 'World'}}</h1>
<input type="text" ng-model="name">
</body>
controller.js:
function AppCtrl($scope) {
$scope.name = "World";
(function closing brace lost by code formatting)
Expected output is "Hello, World", but I get "Hello, {{name || 'World'}}"
You are missing the ng-app and the module in controller.
var app = angular.module('myApp', []);
DEMO
var app = angular.module('myApp', []);
app.controller('AppCtrl', function($scope, $http) {
$scope.name = "World";
});
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
<div ng-app="myApp" ng-controller="AppCtrl">
<h1>Hello, {{name || 'World'}}</h1>
<input type="text" ng-model="name">
</div>
</body>
</html>
Can someone tell me why the hell this plunker is not working?
Sample AngularJS on Plunker
HTML :
<!DOCTYPE html>
<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.6/angular.min.js"></script>
<script src="script.js"></script>
</head>
<body ng-controller="MyCtrl">
<p>{{userData}}</p>
</body>
</html>
JavaScript:
var app = angular.module('myApp', []);
app.controller('MyCtrl', function ($scope) {
$scope.userData = {
name: 'Xavier',
age: 25
}
});
you forgot to put ng-app.
<html ng-app="myApp">
I am following up a tutorial I found here http://codepen.io/keval5531/details/LVYROp/
As a result I am able to come up with the below solution on my app.js
var app = angular.module('plunker', []);
app.controller('DemoCtrl', function($scope) {
$scope.value = false;
$scope.toggleChange = function(){
if($scope.value == false) {
$scope.value = true;
}
else
$scope.value = false;
console.log('testToggle changed to '+$scope.value);
};
});
Now I have this in my index.html file
<!doctype html>
<html ng-app="plunker" >
<head>
<meta charset="utf-8">
<title>AngularJS Plunker</title>
<link rel="stylesheet" href="style.css">
<script src="http://code.angularjs.org/1.2.12/angular-resource.js"></script>
<script src="app.js"></script>
</head>
<body>
<div ng-controller="DemoCtrl">
<br><br>
<ion-toggle ng-model=value ng-change="toggleChange()">Test toggle</ion-toggle>
</div></body>
</html>
Here is a plunk demo I have made
https://plnkr.co/edit/MUp7QckDCgg50FvcfGeG?p=preview
My challenge is that based on the codepen tutorial I am learning with, nothing happens on my display. Kindly assist!
There is a couple of issues here. The first issue is that you didn't include the angular.js file, this is the core of angular and is required. Also, the angular source that you did use didn't work. Here is a fully functional example
var app = angular.module('plunker', []);
app.controller('DemoCtrl', function($scope) {
$scope.value = false;
$scope.toggleChange = function(){
if($scope.value == false) {
$scope.value = true;
}
else {
$scope.value = false;
console.log('testToggle changed to '+$scope.value);
}
};
});
<!doctype html>
<html ng-app="plunker" >
<head>
<meta charset="utf-8">
<title>AngularJS Plunker</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.12/angular.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.12/angular-resource.js"></script>
</head>
<body>
<div ng-controller="DemoCtrl">
<br><br>
<input type="checkbox" ng-model=value ng-change="toggleChange()">Test toggle</ion-toggle>
</div></body>
</html>
I used an alert for dramatic effect.
Regards :)
Hi I am just learning the AngularJS, and trying to save cookies values
I have two html file
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="angular.min.js"></script>
<script src="angular-cookies.min.js"></script>
<script src="angular-route.min.js"></script>
<script src="test.js"></script>
</head>
<body ng-app="myApp" ng-controller="helloCtrl">
Hello <input type="text" ng-model="helloText"/>
<input type="button" ng-click = "redirectToTest()" value="Go" />
</body>
</html>
test.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="angular.min.js"></script>
<script src="angular-cookies.min.js"></script>
<script src="test.js"></script>
</head>
<body ng-app="myApp" ng-controller="testCtrl">
Hello {{cookiesText}}
</body>
</html>
test.js
var myApp = angular.module('myApp', ['ngCookies']);
var helloCtrl = myApp.controller('helloCtrl',
function ($scope, $cookies, $window) {
$scope.helloText = "Hello World!"
$scope.redirectToTest = function(){
$cookies.put('hello', $scope.helloText);
console.log("Added hello to cookies : "+ $cookies.get('hello'));
$window.location.href = "test.html";
}
});
var testCtrl = myApp.controller('testCtrl',
function ($scope,$cookies) {
$scope.cookiesText = '';
$scope.init= function(){
$scope.cookiesText = $cookies.get('hello');
}
});
I am adding some text into cookies and redirecting to test.html to display cookies value, but it lost somewhere ?
Is there $window.location.href reset cookies value ?
Hello I've been searching for reason why my code doesn't work but i can't find it. I've found similar question posted here but non help.
This is my code.
<!DOCTYPE html>
<html ng-app="app">
<head>
<meta charset="utf-8">
<title>AngularJs tests</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.min.js"></script>
</head>
<body ng-controller="Ctrl">
<input type="text" ng-model="blog"><br>
<br>
{{blog}}
<script>
var app=angular.module('app',[]);
app.controller=('Ctrl', ['$scope',function($scope){
$scope.blog="text";
}]);
</script>
</body>
</html>
app.controller = ( ... ); is not valid syntax.
app.controller('Ctrl', ...);
Use this your controller changnge to
var app=angular.module('app',[]);
app.controller('Ctrl', ['$scope',function($scope){
$scope.blog="text";
}]);