如何在自定义指令的模板属性中定义多个元素

Question

以下是我的sample.js

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

app.directive('search', function() {
      return {

        restrict: 'AE',
        replace: true,
       template :'<div>
                  Email <input type = "text"> 
                  Password <input type = "text">
                  <input type = "submit"></div>'

              };
});

我收到以下错误

Template must have exactly one root element. was: <h3>Hello World!!</h3> <h1>Hiii World!!</h1> 

请建议我如何使用模板属性而不是使用templateurl来定义多个元素。

Answer 1

异常本身表示模板必须有一个根元素

试试这个

<强> Working Demo

app.directive('search', function() {
      return {
        restrict: 'AE',
        replace: true,
       template :'<div>\
                  Email <input type = "text"> \
                  Password <input type = "text">\
                  <input type = "submit"></div>'
    };
});