angularjs-将数据从数据库加载到动态创建的textarea

时间:2017-02-02 04:22:01

标签: angularjs

我有10个动态生成的textarea。像用户可以添加或删除textarea。 我从数据库中获取一些数据并且工作正常但在显示时遇到问题。

这是代码。

formApp.controller('getprofile', function($scope,$http){
    $http({
        url: 'get_profile.php',
        method: "GET",
        params: {uid: uid}
    })
    .success(function(data) {

        if (data.success) {

            Need help over here


        }else{
            alert('Error');
        }
    });
})

这是http请求。

exp = 'some text';
exp1 = 'some text';
exp2 = 'some text';
--------------------
exp10 = 'some text';

请告知如何解决此问题。

来自http请求的数据是这样的。

<http use-expressions="true">
    <intercept-url pattern="/login*" access="permitAll"/>
    <intercept-url pattern="/**" access="isAuthenticated()"/>

    <form-login login-page='/login.html'
                authentication-failure-url="/login.html?error=true"
                authentication-success-handler-ref="myAuthenticationSuccessHandler"/>

    <logout/>
</http>

<authentication-manager>
<authentication-provider>
    <user-service>
        <user name="user1" password="user1Pass" authorities="ROLE_USER"/>
        <user name="admin1" password="admin1Pass" authorities="ROLE_ADMIN"/>
        <user name="customer1" password="customer1Pass" authorities="ROLE_CUSTOMER"/>
        <user name="other1" password="other1Pass" authorities="ROLE_OTHER"/>
    </user-service>
</authentication-provider>
</authentication-manager>

<beans:bean id="myAuthenticationSuccessHandler"
            class="org.baeldung.security.MySimpleUrlAuthenticationSuccessHandler"/>  

修改

http://www.shanidkv.com/blog/angularjs-adding-form-fields-dynamically

我正在使用上面链接中的代码并尝试在textarea中添加现有值。

1 个答案:

答案 0 :(得分:0)

如果您的choicesdata是包含类似对象的数组,

 $scope.choices = [
    { id: 1, name: ""},
    { id: 2, name: ""},
    { id: 3, name: ""},
    { id: 4, name: ""}
  ]

  $scope.data = [
    { exp0: " 1 text for choice 1"},
    { exp1: " 2 text for choice 2"},
    { exp2: " 3 text for choice 3"},
    { exp3: " 4 text for choice 4"},
  ]

然后你的解决方案就可以了,

var app = angular.module("myApp", []);
app.controller("myCtrl", function($scope,$http) {
  $scope.choices = [
    { id: 1, name: ""},
    { id: 2, name: ""},
    { id: 3, name: ""},
    { id: 4, name: ""}
  ]
  
  // this code come in success method
  
  $scope.data = [
    { exp0: " 1 text for choice 1"},
    { exp1: " 2 text for choice 2"},
    { exp2: " 3 text for choice 3"},
    { exp3: " 4 text for choice 4"},
  ]
  
  $scope.data.forEach(function (value, i) {
    $scope.choices[i].name =  value['exp'+i]
    console.log(i.toString());
    console.log($scope.choices[i].name)
  });
  
  // this code come in success method
  
  
  
  $http({
        url: 'get_profile.php',
        method: "GET",
        params: {uid: 'uid'}
    })
    .success(function(data) {

        if (data.success) {

            // above code comes here


        }else{
            alert('Error');
        }
    });
});
<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>

<body ng-app="myApp" ng-controller="myCtrl">

<fieldset  data-ng-repeat="choice in choices">
    <div class="col-xs-12">
        <div class="row">
            <div class="col-xs-10">
                <textarea name="{{choice.name}}" ng-model="choice.name" class="form-control textbox1" id="exp_details" placeholder="Experience" required="required" rows="3"></textarea>
            </div>
            <!--<div class="col-xs-2">
                <button class="remove" ng-show="$last" ng-click="removeChoice()">-</button>
            </div>-->

</fieldset>



</body>
</html>

请运行以上代码段。

HERE IS THE WORKING DEMO