CODEWITHSUNDEEP
javascriptangularjs
Ravi Reddy
Ravi Reddy

Reputation: 1

How to config view and contoller module in angular JS

how to link module controller and view in angulaaJS . i am trying to linking with below codes i am getting error please help me to find errors in a code .

controller code:

<!DOCTYPE html>
<html >
<head><title>Angular JS Example</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
</head>
<body>
<div ng-view=""  ng-app="myApp">
</div>
<script>

var app=angular.module('myApp',[]);

app.config(function ($routeProvider){
$routeProvider
  .when('/view1.html',
      {
          controller:'myCtrl',
          templateUrl:'Partials/view1.html'
      })
   .when('/view2',
      {
          controller:'myCtrl',
          templateUrl:'Partials/view2.html'
      })
    .otherwise({redirectTo:'/view1'});
});

app.controller('myCtrl',function($scope){
    $scope.customers=[
               {name:'JohnSmith',city:'Phonenix'}
               {name:'devsenny',city:'New York'}
               {name:'benny',city:'san Francisco'}];
});

$scope.addCust=function(){
$scope.customers.push(
{
name:$scope.newcustomer.name,
city:$scope.newcustomer.city});
};
});
</script>
</body>
</html>

CODE FOR VIEW 1:

<div class="container">
    <h2>View 1</h2>

Name:
<br/>
<input type="text" ng-model="filter.name"/>
<br/>
<ul>
  <li ng-repeat="cust in customers">{{cust}}</li>

</ul>
<br/>
Customer Name:<br/>
<input type="text" ng-model="newcustomer.name">
<br/>
Customer city:<br/>
<input type="text" ng-model="newcustomer.city">
<br/>
<buttton ng-click="addCust()">AddCustomer</button>
</div>

CODE FOR VIEW 2:

<div class="container">
    <h2>View 2</h2>

Name:
<br/>
<input type="text" ng-model="filter.name"/>
<br/>
<ul>
  <li ng-repeat="cust in customers|filter:filter.name">{{cust}}</li>

</ul></div>

Upvotes: 0

Views: 35

Answers (2)

Bhaskara Arani
Bhaskara Arani

Reputation: 1677

on top of the @Steeve Pitis response, you need to run this in your web/app server not in your browser

Upvotes: 0

Steeve Pitis
Steeve Pitis

Reputation: 4453

You just have to put your function into your controller ...

app.controller('myCtrl',function($scope){
    $scope.customers=[
               {name:'JohnSmith',city:'Phonenix'}
               {name:'devsenny',city:'New York'}
               {name:'benny',city:'san Francisco'}];
    $scope.addCust=function(){
       $scope.customers.push(
       {
          name:$scope.newcustomer.name,
          city:$scope.newcustomer.city
       });
    };
});

Upvotes: 1

Related Questions