首页 新闻 搜索 专区 学院

请教angularjs页面赋值完成后执行方法

0
悬赏园豆:10 [已解决问题] 解决于 2017-11-17 09:18

angularjs小白,问下页面有些标签用angularjs绑定了。我想在绑定赋值后执行js方法,如何调用?

<span><span class="product-price">{{vm.orderTotalData.subTotal}}</span></span>

如何在页面渲染成<span><span class="product-price">100</span></span>这样后执行js方法

webaspx的主页 webaspx | 小虾三级 | 园豆:1973
提问于:2017-11-09 16:53
< >
分享
最佳答案
0

就是在js中http请求完成,页面调用函数完成赋值的时候,在最后调用你的其他js方法就好了啊。。。

收获园豆:10
华临天下 | 小虾三级 |园豆:1454 | 2017-11-09 16:58

不会呢,请教,如何写?

webaspx | 园豆:1973 (小虾三级) | 2017-11-09 17:09

@webaspx: 作为小菜鸡的我,要不贴个代码看看吧

华临天下 | 园豆:1454 (小虾三级) | 2017-11-09 17:11

@华临天下: 页面上就是有那些个标签,然后用的angularjs绑定赋值,想知道赋值完成后怎么执行其他的js方法

<div class="total-info" ng-controller="OrderTotalController as vm">

    @Html.Partial("_AjaxLoader", "order-total-content-loader")

    <table class="cart-total" data-aaa="{{vm.orderTotalData.needPaymentPwd}}">
        <tbody>
            <tr>
                <td class="cart-total-left">
                    <span>@T("ShoppingCart.Totals.SubTotal"):</span>
                </td>
                <td class="cart-total-right">
                    <span><span class="product-price">{{vm.orderTotalData.subTotal}}</span></span>
                </td>
            </tr>

            <tr ng-show="vm.orderTotalData.subTotalDiscount">
                <td class="cart-total-left">
                    <span>
                        @T("ShoppingCart.Totals.SubTotalDiscount")

                        :
                    </span>
                </td>
                <td class="cart-total-right">
                    <span><span class="product-price">{{vm.orderTotalData.subTotalDiscount}}</span></span>
                </td>
            </tr>

            <tr>
                <td class="cart-total-left">
                    <span>
                        @T("ShoppingCart.Totals.Shipping"):
                    </span>

                    <span ng-show="vm.orderTotalData.requiresShipping && vm.orderTotalData.selectedShippingMethod" class="selected-shipping-method">
                        {{vm.stringFormat('@T("ShoppingCart.Totals.Shipping.Method")', vm.orderTotalData.selectedShippingMethod) }}
                    </span>
                </td>
                <td class="cart-total-right">
                    <span>
                        <span ng-if="vm.orderTotalData.requiresShipping">
                            <span ng-if="vm.orderTotalData.shipping" class="product-price">
                                {{vm.orderTotalData.shipping}}
                            </span>
                            <span ng-if="!vm.orderTotalData.shipping">
                                @T("ShoppingCart.Totals.CalculatedDuringCheckout")
                            </span>
                        </span>
                        <span ng-if="!vm.orderTotalData.requiresShipping">
                            <span>@T("ShoppingCart.Totals.Shipping.NotRequired")</span>
                        </span>
                    </span>
                </td>
            </tr>

            <tr ng-show="vm.orderTotalData.paymentMethodAdditionalFee">
                <td class="cart-total-left">
                    <span>@T("ShoppingCart.Totals.PaymentMethodAdditionalFee"):</span>
                </td>
                <td class="cart-total-right">
                    <span class="product-price">{{vm.orderTotalData.paymentMethodAdditionalFee}}</span>
                </td>
            </tr>

            <tr ng-show="vm.orderTotalData.displayTaxRates && vm.orderTotalData.taxRates.length > 0" ng-repeat="taxRate in vm.orderTotalData.taxRates">
                <td class="cart-total-left">
                    <span>
                        {{vm.stringFormat('@T("ShoppingCart.Totals.TaxRateLine")', taxRate.rate) }}
                    </span>
                </td>
                <td class="cart-total-right">
                    <span>
                        {{taxRate.value}}
                    </span>
                </td>
            </tr>

            <tr ng-show="vm.orderTotalData.displayTax">
                <td class="cart-total-left">
                    <span>@T("ShoppingCart.Totals.Tax"): </span>
                </td>
                <td class="cart-total-right">
                    <span><span class="product-price">{{vm.orderTotalData.tax}}</span></span>
                </td>
            </tr>

            <tr ng-show="vm.orderTotalData.orderTotalDiscount">
                <td class="cart-total-left">
                    <span>
                        @T("ShoppingCart.Totals.OrderTotalDiscount"):
                    </span>
                </td>
                <td class="cart-total-right">
                    <span class="product-price">{{vm.orderTotalData.orderTotalDiscount}}</span>
                </td>
            </tr>

            <tr ng-repeat-start="giftCard in vm.orderTotalData.giftCards">
                <td class="cart-total-left">
                    <span>
                        {{vm.stringFormat('@T("ShoppingCart.Totals.GiftCardInfo")', giftCard.couponCode) }}

                        <button type="button" ng-show="vm.orderTotalData.isEditable" ng-confirm-message="@T("Common.AreYouSure")" ng-confirm-click="vm.orderTotalData.giftCardId = giftCard.id">@T("Common.Remove")</button>:
                    </span>
                </td>
                <td class="cart-total-right">
                    <span class="product-price">{{giftCard.amount}}</span>
                </td>
            </tr>
            <tr ng-repeat-end>
                <td class="cart-total-left below">
                    <span>
                        {{vm.stringFormat('@T("ShoppingCart.Totals.GiftCardInfo.Remaining")', giftCard.remaining) }}
                    </span>
                </td>
                <td class="cart-total-right below"></td>
            </tr>


            <tr ng-show="vm.orderTotalData.redeemedRewardPoints > 0">
                <td class="cart-total-left">
                    <span>
                        {{vm.stringFormat('@T("ShoppingCart.Totals.RewardPoints")', vm.orderTotalData.redeemedRewardPoints) }}
                    </span>
                </td>
                <td class="cart-total-right">
                    <span class="product-price">{{vm.orderTotalData.redeemedRewardPointsAmount}}</span>
                </td>
            </tr>

            <tr class="cart-total-row">
                <td class="cart-total-left">
                    <span>
                        @T("ShoppingCart.Totals.OrderTotal"):
                    </span>
                </td>
                <td class="cart-total-right">
                    <span>
                        <span ng-if="vm.orderTotalData.orderTotal" class="product-price order-total" id="span_orderTotal"><strong>{{vm.orderTotalData.orderTotal}}</strong></span>
                        <span ng-if="!vm.orderTotalData.orderTotal">@T("ShoppingCart.Totals.CalculatedDuringCheckout")</span>
                    </span>
                </td>
            </tr>

            <tr class="will-earn-reward-points" ng-show="vm.orderTotalData.willEarnRewardPoints > 0">
                <td class="cart-total-left">
                    <span>@T("ShoppingCart.Totals.RewardPoints.WillEarn"):</span>
                </td>
                <td class="cart-total-right">
                    <span class="product-price">
                        {{vm.stringFormat('@T("ShoppingCart.Totals.RewardPoints.WillEarn.Point")', vm.orderTotalData.willEarnRewardPoints) }}
                    </span>
                </td>
            </tr>
        </tbody>
    </table>
</div>

这是页面上的代码

webaspx | 园豆:1973 (小虾三级) | 2017-11-09 17:13

@webaspx: 这个好像是cshtml,没有用过耶。但是看这个样子好像是在后台直接给页面传了一个对象,然后绑定值的,所以你直接在下面写JS方法试试

<script type="text/javascript">
$(function () {
alert("页面加载完成");
});

</script>

看看能不能弹出个东西来,行的话应该就可以执行其他JS

华临天下 | 园豆:1454 (小虾三级) | 2017-11-09 17:21

@webaspx: 刚刚翻到以前写的DEMO,看看有没有什么帮助

<body ng-controller="myContr">
    <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 m-top ">
        <div class="input-group col-lg-3 col-md-3 col-sm-3 col-xs-3">
            <!--<span class="glyphicon glyphicon-search" aria-hidden="true"></span> 搜索的小图标-->
            <span class="input-group-addon bg_color">
                <span class="glyphicon glyphicon-yen" aria-hidden="true"></span>          
            </span>
            <input id="Input" type="text" class="form-control" placeholder="请输入金额" aria-describedby="basic-addon1" ng-change="fnChange()" ng-model="myValue">
        </div>
        <div class="input-group col-lg-4 col-md-4 col-sm-4 col-xs-4 ">
            <span class="input-group-addon bg_color">
                <span class="glyphicon glyphicon-yen" aria-hidden="true"></span>
            </span>
            <input id="CapitalMoney" type="text" class="form-control" placeholder="中文金额" aria-describedby="basic-addon1" disabled="disabled">
        </div>
        <div class="col-lg-5 col-md-5 col-sm-5 col-xs-5 m-top ">
           <label>大写金额:{{Capital}}</label>
        </div>
    </div>
    <script>
        angular.module("myApp", []).controller('myContr', ['$scope', function ($scope) {
            $scope.Capital="";         
            $scope.fnChange = function () {
                var total = $("#Input").val();
                var Capital = ConvertToChinese(total);
                $scope.Capital = Capital;
                $("#CapitalMoney").val(Capital);
                //    var reg = /(^[1-9]([0-9]+)?(\.[0-9]{1,2})?$)|(^(0){1}$)|(^[0-9]\.[0-9]([0-9])?$)/;///^[1-9]{1}\d*(\.\d{1,2})?$/;
                //    if (total != "") {
                //        if (!reg.test(total)) {
                //            //alert("数字不合法!"); $("#Input").val(""); $("#CapitalMoney").val("");
                //        } else {
                //            var Capital = ConvertToChinese(total);
                //            $("#CapitalMoney").val(Capital);
                //        }
                //    } else {
                //        $("#CapitalMoney").val("");
                //    }
                }
            }]);
    </script>
华临天下 | 园豆:1454 (小虾三级) | 2017-11-09 17:28
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册