support filters in props

src/compiler/compile-props.js

@@ -1,4 +1,5 @@
 var _ = require('../util')
+var dirParser = require('../parsers/directive')
 var propDef = require('../directives/internal/prop')
 var propBindingModes = require('../config')._propBindingModes
 
@@ -19,7 +20,7 @@ var literalValueRE = /^(true|false)$|^\d.*|^'[^']*'$|^"[^"]*"$/
 module.exports = function compileProps (el, propOptions) {
   var props = []
   var i = propOptions.length
-  var options, name, attr, value, path, prop
+  var options, name, attr, value, path, parsed, prop
   while (i--) {
     options = propOptions[i]
     name = options.name
@@ -61,7 +62,9 @@ module.exports = function compileProps (el, propOptions) {
       value = prop.raw = el.getAttribute(attr)
       if (value !== null) {
         el.removeAttribute(attr)
-        value = value.trim()
+        parsed = dirParser.parse(value)
+        value = parsed.expression
+        prop.filters = parsed.filters
         // check binding type
         if (literalValueRE.test(value)) {
           // for bind- literals such as numbers and booleans,

src/directives/internal/prop.js

@@ -27,6 +27,7 @@ module.exports = {
         }
       }, {
         sync: true,
+        filters: prop.filters,
         // important: props need to be observed on the
         // v-for scope if present
         scope: this._scope

test/unit/specs/directives/internal/prop_spec.js

@@ -37,6 +37,33 @@ if (_.inBrowser) {
       })
     })
 
+    it('with filters', function (done) {
+      var vm = new Vue({
+        el: el,
+        template: '<test name:="a | test"></test>',
+        data: {
+          a: 123
+        },
+        filters: {
+          test: function (v) {
+            return v * 2
+          }
+        },
+        components: {
+          test: {
+            props: ['name'],
+            template: '{{name}}'
+          }
+        }
+      })
+      expect(el.textContent).toBe('246')
+      vm.a = 234
+      _.nextTick(function () {
+        expect(el.textContent).toBe('468')
+        done()
+      })
+    })
+
     it('two-way binding', function (done) {
       var vm = new Vue({
         el: el,