在ng单击另一个onsen页面后如何在onsen页面上显示$ http数据

时间:2019-03-07 05:53:58

标签: javascript angularjs angularjs-scope onsen-ui

我在第一页上显示了供应商的潜在顾客数据列表,每当供应商单击任何潜在顾客时,潜在顾客详细信息就必须显示在另一页上, 这是我的第一页代码,所有潜在客户数据将通过使用ng-repeat显示给供应商,并且我对此没有任何问题,可以显示潜在客户数据列表

<ons-page id="leads" ng-controller="leadsController">
    <ons-toolbar>
        <div class="left"><ons-back-button>Dashboard</ons-back-button></div>
        <div class="center"></div>
    </ons-toolbar>
    <section class="bg-dashboard">
        <section class="width100" ng-if="status =='TRUE'">
            <div class="width100 ft-lt leadArea" ng-repeat="leads in final">
                <div class="width10 icon-area" ng-click="leadDetailClick(leads.lead_id)">
                  <ons-icon icon="fa-user-circle"></ons-icon>
                 </div>
                <div class="name-area">
                    {{leads.name}}
                </div>
                <div class="width40 date-area">
                    <div class="date">
                        <div class="date-position">
                            {{leads.vo_created | dateConvert | date:'longDate'}}
                        </div>
                    </div>

                </div>
                <div class="phone-area">
                    <span class="phoneNo"><ons-icon icon="fa-phone"></ons-icon> {{leads.phone}}</span>
                </div>
            </div>
        </section>
        <section class="width100" ng-if="status!='TRUE'">
            <div class="leadArea">

                <div class="width100 status-failed">
                    {{status}}
                </div>


            </div>
        </section>

    </section>
</ons-page>

现在,这是我要在其中显示潜在顾客数据的另一页的代码,这意味着当用户单击任何潜在顾客时,潜在顾客的详细信息将在此页面上显示

<ons-page id="leads" ng-controller="leadsController">
    <ons-toolbar>
        <div class="left"><ons-back-button>Dashboard</ons-back-button></div>
        <div class="center"></div>
    </ons-toolbar>
    <section class="bg-dashboard">
        <section class="width100">
            <div class="width100 leadArea">
                <div class="width100">
                    <div class="img-area">
                        <ons-icon icon="fa-user-circle"></ons-icon>
                    </div>
                    <div class="usern-name">
                        {{leadMain}}
                    </div>
                    <div class="lead-date">
                        <ons-icon icon="fa-calender"></ons-icon> {{leadMain.vo_created}}
                    </div>
                </div>

                <div class="width10 icon-area">
                    <ons-icon icon="fa-user-circle"></ons-icon>

                </div>
                <div class="name-area">

                </div>
                <div class="width40 date-area">
                    <div class="date">
                        <div class="date-position">

                        </div>
                    </div>

                </div>
                <div class="phone-area">
                    <span class="phoneNo"><ons-icon icon="fa-phone"></ons-icon> </span>
                </div>
            </div>
        </section>


    </section>
</ons-page>

这是我的angularjs控制器代码,从这里我获取潜在客户数据列表,并从获取$ http数据的位置执行ng-click函数,此方法工作正常,但细节未显示在我的第二页,即潜在顾客详细页面

dvapp.controller('leadsController', ['$scope', '$http', function ($scope, $http,$rootScope) {
    var v = localStorage.getItem('vendor');
    var ve = JSON.parse(v);
    var leadMain, leadDetail;
    var vendorid = ve.vendor_id;
    $http.get('https://myapi.com/api/getVendorLeadList/' + vendorid)
        .then(function successCallBack(response) {
            $scope.myLeads = JSON.stringify(response.data);
            $scope.data = JSON.parse($scope.myLeads);
            if ($scope.data.hasOwnProperty('status'))
            {
                $scope.status = "Sorry You Don't have any leads";
            }
            else
            {
                $scope.status = "TRUE";
                $scope.final = JSON.parse($scope.myLeads);
            }
        });

    $scope.leadDetailClick = function (leadid) {
       document.querySelector('#loginNavigator').pushPage('vendor/leadDetail.html', { data: { title: 'Lead Detail' } });
       $http.get('https://myapi.com/api/getVendorLeadDetail/' + vendorid + '/' + leadid)
           .then(function successCallBack(response) {
                 $scope.leadMain = response.data.main;
                 $scope.leadDetail = response.data.detail;
           });

    };

}]);

现在我的问题是,一切正常,例如firstPage正确加载,其中所有线索均由供应商获得,可以确定,然后单击ng-click,在我传递leadid的地方,而不是另一页也已加载,这也可以正常工作但是$ scope.leadMain数据未显示在我的secondPage上,请帮我弄错我的地方

0 个答案:

没有答案