0

//this is the app.js go down below to see controller.js
angular.module('myFirstApp',['ngRoute'])

.config(function($routeProvider){
  $routeProvider.when('/contact',{
      templateURL : 'contact.html'
  })
  
})

.factory('personFactory',function(){
    

    function insertData(Name,Email,Password,Mobile){
      //save data to database
      var x = "This is add data";
      return x;
    }
    
    
     function getData(){
       //get data from database
      var x = "This is retrieve data";
      return x;
    }
  
    
    function updateData(){
      //update data to database
      
      return "This is edit data";
    }
    
   
   return {
    insertData,
        getData,
        updateData
   };
 
  })


//this is controller.js
angular.module('myFirstApp')

.controller('myController',function($scope,personFactory){
  $scope.firstName ="asd";
  $scope.Message = "In the beginning";
  
  $scope.addRecord = function(){
    
    var x = personFactory.insertData($scope.Name,$scope.Email,$scope.Password,$scope.Mobile,$scope.result);
    $scope.message = "You have successfuly added new data";
    return x + ' ' + $scope.message;
   
  }
  
  $scope.retrieveRecord = function(){
      return personFactory.getData();
  }

  
  $scope.editRecord = function(){
  return personFactory.updateData();
  }
  
})



  
<!DOCTYPE html>
<html ng-app="myFirstApp">

  <head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular-route.js"></script>
    <script src="app.js"></script>
    <script src="controller.js"></script>

    <title>AlbuquerqueApp</title>
  </head>
 
  <body>
  <a href="#home">Home</a>
  <a href="#people">People</a>
  <a href="#about">About</a>
  <a href="#contact">Contact</a>
    <div>
        <div ng-view></div>
    </div>

    <h1>Begin</h1>
    <div ng-controller="myController">

Name :          <input type="text" ng-model="Name" />
      <br />

Email :       <input type="text" ng-model="Email" />
      <br />

Password :       <input type="text" ng-model="Password" />
      <br />  
      
      
Mobile :       <input type="text" ng-model="Mobile" />
      <br />
      
<button ng-click="addRecord()">Submit</button>

<h1>Hello,   {{message}}</h1>
<h1>Hello,   {{retrieveRecord()}}</h1>
<h1>Hello,   {{editRecord()}}</h1>
    </div>
  </body>

</html>

This is not working, .factory is inside app.js, all controllers are inside controller.js.

My problem : .config inside app.js is not working with index.html's about href and contact href.

The html pages of about and contact are created successfuly. What is the issue? ,I cant figure out why. I checked that the script reference of angular comes first. Everything is ok. even the calling of the method of controller to factory. The only left out is .config

marc_s
  • 732,580
  • 175
  • 1,330
  • 1,459
John Masqued
  • 21
  • 9
  • If confiq is not working then try with state provider .use .config(function($stateProvider, $urlRouterProvider,$httpProvider) { .state('app', { url: "/contact", templateUrl: "templates/social/contact.html" })$urlRouterProvider.otherwise('/app/contact'); Create Codepen for better response,. – Anuj Nov 17 '16 at 10:13
  • Could you make us a plunkr or something to try please ? –  Nov 17 '16 at 10:16
  • its answered , i wrote templateURL which is incorrect. It should be templateUrl , im crazy.. – John Masqued Nov 17 '16 at 12:34

1 Answers1

1

You have written:

        .config(function($routeProvider){
                $routeProvider.when('/contact',{
                templateUrl : 'contact.html' //use templateUrl instead of templateURL
        })

use templateUrl instead of templateURL

i tried on my system works fine for me

refer https://docs.angularjs.org/api/ngRoute/service/$route#example you can check the example there.

Let me know if this does not work.

Nesar
  • 96
  • 7
  • your 100% correct , i was about to commit suicide with this one. WOW unbelievable , i spent 2 hours just to figure out. I memorized the syntax and wrote it but i did not become aware with the uppercase and lowercase. THANKS a lot , hope to hear from you if ive got questions, one more thing what is the best option (ionic routing or ui route, or routeprovider?) – John Masqued Nov 17 '16 at 12:27
  • I usually use ui-router – Nesar Nov 17 '16 at 15:39
  • but i work on Web Applications, for mobile i am not sure. – Nesar Nov 17 '16 at 15:40
  • hi nesar, ive got new question http://stackoverflow.com/questions/40672668/angularjs-function-in-controller-and-factory-not-working-when-separated – John Masqued Nov 18 '16 at 09:49