Angular js：如何在ng-view中加载服务器响应

I am developing and website in codeigniter and angualrJs.

我正在开发和使用codeigniter和angualrJs的网站。

I an trying to load view in ui-view from controller- action of codeigniter using $state route method. But I am not getting any response. Is need to use http get method for this.

我试图使用$ state route方法从codeigniter的controller-action加载ui-view中的视图。但我没有得到任何回应。需要为此使用http get方法。

Below is my code. app.js

以下是我的代码。 app.js

 (function () {
    "use strict";
    var app = angular.module("autoQuote",["common.services","ui.router"]);

    app.config(["$stateProvider","$urlRouterProvider"], function($stateProvider,$urlRouterProvider){
        $urlRouterProvider.otherwise("/");

        $stateProvider
            .state("step1", {
              url : "/",
              templateURL : "http://dev.angauto.domain.com/rc1/renderstep/step1"
            })

            .state("step2", {
              url : "/",
              templateURL : "http://dev.angauto.domain.com/rc1/renderstep/step2"
            })
    }
    );
}());

common.services.js

(function () {
    "use strict";

    angular
        .module("common.services",
                ["ngResource"])
}());

autoQuoteCtrl.js

(function(){
     "use strict";
     angular
     .model("autoQuote")
     .controller("prepareDTO","prepareDTO");

     function prepareDTO()
     {
         var vm = this;
         vm.postAutoQuoteObj = [];
     }

 });

html

    <script src="<?php echo $assetName; ?>/js/jquery-3.0.0.min.js"></script>
    <script src="<?php echo $assetName; ?>/js/angular.js"></script>
    <script src="<?php echo $assetName; ?>/js/angular-resource.js"></script>
    <script src="<?php echo $assetName; ?>/js/angular-mocks.js"></script>
    <script src="<?php echo $assetName; ?>/js/angular-ui-router.js"></script>
    <script src="<?php echo $assetName; ?>/js/bootstrap.js"></script>

    <!-- Application Script -->
    <script src="<?php echo $assetName; ?>/app/app.js"></script>

    <!-- services -->
    <script src="common/services/common.services.js"></script>

    <!-- Controllers -->
    <script src="<?php echo $assetName; ?>/app/ctrl/autoQuoteCtrl.js"></script>
</head>
<body ng-app="autoQuote">
<div ui-view></div>
</body>

Please suggest me if I am missing something here.

如果我在这里错过了什么,请建议我。

2 个解决方案

#1

i did notice there is $urlRouterProvider in injecting to function has extra "e"

我注意到在注入函数时有$ urlRouterProvider有额外的“e”

app.config(["$stateProvider","$urlRouterProvider"], function($stateProvider,$urlRouterProvider){
    $urlRouterProvider.otherwise("/");

    $stateProvider
        .state("step1", {
          url : "/",
          templateURL : "http://dev.angauto.insurance.com/rc1/renderstep/step1"
        })

        .state("step2", {
          url : "/",
          templateURL : "http://dev.angauto.insurance.com/rc1/renderstep/step2"
        })
}
);

}());

#2

There is a working plunker

有一个工作的plunker

You are almost there.. just UI-Router places vies into targets named ui-view, not the ng-view

你几乎就在那里..只是UI-Router将vies放入名为ui-view的目标,而不是ng-view

//<div ng-view></div>
<div ui-view></div>

And also, to use array for IoC, we need array which will encapsulate even the function (check the removed ] sign before function)

而且,要为IoC使用数组,我们需要数组甚至封装函数(在函数之前检查删除的符号)

//app.config(["$stateProvider","$urlRouterProvider"], function($stateProvider,$urlRouterProvider){

app.config(["$stateProvider","$urlRouterProvider", function($stateProvider,$urlRouterProvider){
    $urlRouterProvider.otherwise("/");

    $stateProvider
        .state("step1", {
          url : "/",
          //templateURL : "http://dev.angauto.domain.com/rc1/renderstep/step1"
          templateUrl: "tpl.html"
        })

        .state("step2", {
          url : "/step2",
          //templateURL : "http://dev.angauto.domain.com/rc1/renderstep/step2"
          templateUrl: "tpl.html"
        })
}]

Check it here

在这里查看

There is another example

还有另一个例子

which uses templateUrl (instead of template) but not templateURL

它使用templateUrl(而不是模板)但不使用templateURL

    $stateProvider
        .state("step1", {
          url : "/",
          //templateURL : "http://dev.angauto.domain.com/rc1/renderstep/step1"
          templateUrl : "rc1/renderstep/step1.php"

        })

        .state("step2", {
          url : "/step2",
          //templateURL : "http://dev.angauto.domain.com/rc1/renderstep/step2"
          templateUrl : "rc1/renderstep/step2.html"
        })

#1