简体   繁体   中英

Pass value to a function in ng-init

I want to repeat data using div and in this div , I have one more repeatation using id value from first repeatation. So I want to pass this value using function in ng-init but got me error.

        <div ng-controller="ProductsCtrl" ng-init="getData()">         
        <div class="col-sm-12" ng-repeat="data in form">
            <div class="card">
                <div class="card-header">
                    <h4>{{data.title}}</h4>
                </div>          
                <div class="card-block">
                    <div class="row" ng-init="getImages({{data.id}})">
                        <div class="form-group col-sm-3" ng-repeat="image in images">
                            <figure>
                              <img ng-src="{{imgURL}}/{{image.file_name}}" width="220" height="176">&nbsp;
                              <figcaption>Fig.1 - A view of the pulpit rock in Norway.</figcaption><br />
                              <label>Description : {{image.remarks}}</label><br />
                              <a href="">Read More . .</a>
                            </figure>
                        </div>
                    </div>
                </div>
                <div class="card-footer">
                    <h4>{{data.description}}</h4>
                </div>             
            </div>           
        </div>
    </div> 

So, how can I pass {{data.id}} in ng-init="getImages({{data.id}})"? If I put value ng-init="getImages(15)" then, item will appear.

file.js

    $scope.getImages = function (id2) {

    $http.get(commonData.apiURL + 'product/detailsImage.php?id='+id2)
        .success(function (data) {
            $scope.images = data;
            //console.log(JSON.stringify(data));
        })
        .error(function (data, status, headers, config) {
            $scope.errorMessage = "Couldn't load the list of Orders, error # " + status;
            console.log("error");
    });


}

You do not need annotations {{}}

 ng-init="getImages(data)

and then inside the controller

$scope.getImages = function(data){
 console.log(data.id);
}

You need to keep one thing in mind, If you are want your angular code to work on html page, use {{}}. And you do not need these curly braces if you are writing the code with the angular attributes... It means if something is already part of angularjs, you need not to use curly braces.

To solve this issue, you need to replace the below line

<div class="row" ng-init="getImages({{data.id}})">

with this following line

<div class="row" ng-init="getImages(data.id)">

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM