自定义指令不加载模板

Question

app.js文件：

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

app.directive('productTitle', function(){
   return {
   restrict: 'E',
   templateUrl: 'product-title.html'
  };
});

的index.html

<product-title></product-title>

产品title.html

{{ product.name}}
<em class="pull-right">{{ product.price | currency}}</em>

但该指令未加载模板。我错过了什么？