2016-12-19 8 views
0

私はまだAngularjsの新しいプログラマーです。私は自分のサイトにコントローラを追加する際に問題が発生しています。私は2つの他のコントローラをサイトに接続して正常に動作していますが、何らかの理由でこれが認識されていません。エラー:ng:areq不正な引数 'ClientCtrl'は関数ではありません。

私app.js

var app = angular.module('app', ['JobCtrl','JobSvc','WebsiteCtrl', 'WebsiteSvc','ClientCtrl','ClientSvc','ui.bootstrap', 'ui.bootstrap.tpls']); 

私のhtml

<!DOCTYPE html> 
<div ng-app="app"> 
    <div ng-controller="ClientCtrl" ng-cloak> 
     <div class="row"> 
      <br /> 
      <div class="col-sm-2 pull-right"> 
       <button class="btn btn-primary" ng-click="showModal('Add')">Add Client</button> 
      </div> 
      <input ng-model="searchKeyword" type="text" class="form-control col-md-6 pull-right" placeholder="Search Clients..."> 
      <h2 class="col-md-4">Clients</h2> 
     </div> 

     <table class="table table-condensed table-hover"> 
      <thead> 
      <td class="text-center"> 
       <strong>Name</strong> 
      </td> 
      <td class="text-center"> 
       <strong>Actions</strong> 
      </td> 
      </thead> 

      <tbody ng-repeat="c in model.clientList | filter: searchKeyword "> 
       <tr> 
        <td class="text-center"> 
         {{c.Name}} 
        </td> 
        <td class="text-center"> 
         <button class="btn btn-default" data-toggle="tooltip" data-placement="top" title="Edit" ng-click="selectClient(c); showModal('Edit', c)" /><span class="glyphicon glyphicon-pencil"></span> 
         <button class="btn btn-default" data-toggle="tooltip" data-placement="top" title="Delete" ng-click="selectClient(c); showModal('Delete', c)" /><span class="glyphicon glyphicon-trash"></span> 
        </td> 
       </tr> 
      </tbody> 
     </table> 
    </div> 
</div> 

私のコントローラ

angular.module('app') 
.controller('ClientCtrl', ['ClientService', '$scope', '$http', '$uibModal', function (ClientService, $scope, $http, $uibModal, $uibModalInstance) { 
    //$scope.model = ClientService.getClients(); 
    $scope.new = { 
     Client: {} 
    }; 

    //create alerts when page reloads after crud functions 
    if (localStorage.getItem("Success")) { 
     $scope.alert = "Success"; 
     $scope.alertMessage = localStorage.getItem("Success"); 
     localStorage.clear(); 
    } else if (localStorage.getItem("Error") && localStorage.getItem("Error") != null) { 
     //sometimes get errors even when adding, deleting, updating is successful 
     $scope.alert = "Error"; 
     $scope.alertMessage = localStorage.getItem("Error"); 
     localStorage.clear(); 
    }; 

    getClients(); 
    function getClients() { 
     ClientService.getClients() 
     .then(
      function (data) { 
       $scope.model = data; 
      }, 
      function (errResponse) { 
       console.log("Error while getting clients"); 
      } 
     ); 
    } 

    $scope.addClient = function() { 
     ClientService.addClient() 
     .then(
      function (success) { 
       localStorage.setItem("Success", "Added client Id:" + success.Id + " Successfully!"); 
      }, 
      function (error) { 
       localStorage.setItem("Error", "Error while adding client! " + error.status + ":" + error.statusText); 
       alert(error.status + " " + error.statusText); 
      } 
     ); 
     //location.reload(); 
    } 

    $scope.updateClient = function() { 
     ClientService.updateClient() 
     .then(
     function (success) { 
      localStorage.setItem("Success", "Updated client Id:" + success.Id + " Successfully!"); 
     }, 
     function (error) { 
      localStorage.setItem("Error", "Error while updating client! " + error.status + ":" + error.statusText); 
      alert(error.status + " " + error.statusText); 
     } 
     ); 
     //location.reload(); 
    } 

    $scope.deleteClient() = function() { 
     ClientService.deleteClient() 
     .then(
      function (success) { 
       localStorage.setItem("Success", "Deleted client Id: " + success.Id + " Successfully!"); 
      }, 
      function (error) { 
       localStorage.setItem("Error", "Error while deleting client: " + error.status + error.statusText); 
       alert(error.status + " " + error.statusText); 
      } 
     ); 
     //location reload(); 
    } 

    //select client 
    $scope.selectClient = function (client) { 
     $scope.selectedClient = client; 
    } 

    //show modal function 
    $scope.showModal = function (action, obj) { 
     $scope.showBool = true; //boolean to be able to exit modal after update 
     $scope.model.runButtonText = "Run Job"; //this is for run job only 
     $scope.$modalInstance = $uibModal.open({ 
      scope: $scope, 
      inputs: { 
       title: action + " Client" 
      }, 
      restrict: "E", 
      templateUrl: 'app/modal/ClientModals/modal' + action + 'Template.html', 
      controller: "JobCtrl", 
      backdrop: 'static', 
      keyboard: false 

     }); 
    } 

    //exit modal function 
    $scope.exitModal = function() { 
     $scope.$modalInstance.dismiss('cancel'); 
    }; 

}]); 

すべてのヘルプは素晴らしいだろう、私はちょうど私の他のコントローラがどのように理解していませんこれは定義されていると考えられていますが、

答えて

0

あなたは、コントローラの作成にあなたの依存関係($uibModalInstance)のいずれかを忘れてしまった:

.controller('ClientCtrl', ['ClientService', '$scope', '$http', '$uibModal', 
        function (ClientService, $scope, $http, $uibModal, $uibModalInstance) { 

は次のようになります。

悲しいこと
.controller('ClientCtrl', ['ClientService', '$scope', '$http', '$uibModal', '$uibModalInstance' 
        function (ClientService, $scope, $http, $uibModal, $uibModalInstance) { 
+0

、これはそれを修正しませんでした。これは小型化のために重要です。しかし、明示的な依存関係の一部としてuibModalInstanceを追加しても、ClientCtrlはまだ定義されていませんが、関数エラーではありません。しかし、ありがとう! – DDelgro

+0

コントローラのJSファイルをindex.htmlに正しくインポートしましたか? – Mistalis

+0

私はMVC C#Webアプリケーションを実行しているので、私のアングルはBundleConfig.csにバンドルされ、_Layout.cshtmlページにレンダリングされているので、これを行う必要はありませんでした。私が知る限り、他のコントローラーを使って新しいコントローラーを参照する必要はありませんでした。 – DDelgro

関連する問題