函数调用后未填充虚拟数组值

时间:2017-10-27 12:44:14

标签: javascript html css angularjs ajax

我正在尝试创建基于国家,城市基于城市填充状态的下拉列表,但最初当页面加载时,它包含先前从数组中提取的数据。试图调用GetSelectedCountry和GetSelectedState函数因为包含在ng中的mydata而无法工作下拉列表中的模型和虚拟数组值最初在页面加载时不显示。以下是我的虚拟代码。

<asp:Button ID="btnExpand" runat="server" CssClass="btn" Text="Expand" ToolTip="Expand text area to view all text"
            Enabled="true" OnClientClick="return false;"/>
<asp:Button ID="btnShrink" runat="server" CssClass="btn" Text="Shrink" ToolTip="Shrink text area to original size"
            Enabled="false" />
<script type="text/javascript">                     
    document.getElementById('<%= this.btnExpand.ClientID %>').addEventListener("click", function () {
        if (document.getElementById('<%= this.txtTextArea.ClientID %>').clientHeight < document.getElementById('<%= this.txtTextArea.ClientID %>').scrollHeight) {
            document.getElementById('<%= this.txtTextArea.ClientID %>').style.height = document.getElementById('<%= this.txtTextArea.ClientID %>').scrollHeight+ "px";
            document.getElementById('<%= this.btnShrink.ClientID %>').disabled = false;
            document.getElementById('<%= this.btnExpand.ClientID %>').disabled = true; 
        }
        return false;
    });
    document.getElementById('<%= this.btnShrink.ClientID %>').addEventListener("click", function () {
        document.getElementById('<%= this.txtTextArea.ClientID %>').style.height = '80px';
        document.getElementById('<%= this.btnShrink.ClientID %>').disabled = true;
        document.getElementById('<%= this.btnExpand.ClientID %>').disabled = false;
        return false;
    });

1 个答案:

答案 0 :(得分:1)

因为你在ng-model中使用mydata.country和mydata.state所以在脚本中你可以通过

访问它们
  $scope.GetSelectedCountry = function() {
                    $scope.strCountry = $scope.mydata.country;
                };
                $scope.GetSelectedState = function() {
                    $scope.strState = $scope.mydata.state;
                };

否则只需在html中更改国家和州的ng-model名称,如

<select id="country" name="country" ng-model="country" ng-options="country for (country, states) in countries"
        ng-change="GetSelectedCountry()">
            <option value=''>Select</option></select>   <label for="state">State *</label>   
<select id="state" ng-disabled="!country" name="state" ng-model="state" ng-options="state for (state,city) in country"

附上一个有效的捡拾器

https://plnkr.co/edit/zUyL9aGSWt9hysH4cjnT?p=preview