ng-repeat内插

Question

I have a markup like this

<li ng-repeat="macro in macros" style="cursor:pointer" ng-click="copyToChat($event); $hide()">
        {{macro}}
        </li>



var macros = 
[
"Hey {{activeUserName}} ! I'm sorry"
];

Here {{activeUserName}} is not interpolated. How can I resolve it

Answer 1

Try out this way

Working Demo

use a directive to compile your stuff from the string.

html

<div ng-app='myApp' ng-controller="Controller">
    <li ng-repeat="macro in macros" style="cursor:pointer" ng-click="copyToChat($event); $hide()">
        <span compile="macro"></span>
    </li>
</div>

script

var app = angular.module('myApp', []);
app.controller('Controller', function ($scope) {
    $scope.macros = ["Hey {{activeUserName}} ! I'm sorry"];
    $scope.activeUserName = "maddhur";
})

app.directive('compile', ['$compile', function ($compile) {
    return function (scope, element, attrs) {
        scope.$watch(function (scope) {
            return scope.$eval(attrs.compile);
        },function (value) {
            element.html(value);
            $compile(element.contents())(scope);
        });
    };
}])