相关疑难解决方法(0)

动态地将Angularjs绑定到新创建的html元素

我有一个带有多个标签的标签页,一旦点击就会调用服务来返回一些数据.其中一些数据返回html表单并且非常随机.我想收集输入的值,并通过服务将数据发送回服务器.我遇到的问题是我无法从动态创建的html中的输入元素中获取数据.

我创建了一个Plunker来展示问题所在.请注意,html值可以随时更改,因此硬编码html将无法正常工作.这里是来自plunker的代码,但请查看plunker以获得最佳视图.

app.js

var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope, $sce, $compile) {
    $scope.name = 'World';
    $scope.html = "";

    $scope.htmlElement = function(){
        var html = "<input type='text' ng-model='html'></input>";
        return $sce.trustAsHtml(html);
    }

});
Run Code Online (Sandbox Code Playgroud)

的index.html

<!DOCTYPE html>
<html ng-app="plunker">

  <head>
    <meta charset="utf-8" />
    <title>AngularJS Plunker</title>
    <script>document.write('<base href="' + document.location + '" />');</script>
    <link rel="stylesheet" href="style.css" />
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0-rc.3/angular.js"></script>
    <script src="app.js"></script>
  </head>

  <body ng-controller="MainCtrl">
    <p>Hello {{name}}!</p>

    <div ng-bind-html="htmlElement()"></div>

    {{html}}

  </body>

</html>
Run Code Online (Sandbox Code Playgroud)

model-binding angularjs

18
推荐指数
2
解决办法
5万
查看次数

标签 统计

angularjs ×1

model-binding ×1