将对象（变量）传递给指令angularjs

Question

控制器处于状态。

.controller('test', function($scope) {
    $scope.variable = 'Hello';
    $scope.other = 'Hi';
})
.directive('customDir', function() {
    return {
        restrict: 'A',
        link: function($scope, element, attrs) {
            attrs.customDir += ' Word';
        }
    }
});

<input type="text" custom-dir="variable" />
<div>{{variable}}</div>

<input type="text" custom-dir="other" />
<div>{{other}}</div>

我需要$ scope.variable和$ scope.other接收＆＃34; Word＆＃34;，必须能够在Directive中更改传递变量的值。

Answer 1

有几种方法。第一个是使用双向绑定：

Temporary folder: /private/tmp/monaca/571550297e2193515015be16
Downloading project
Download complete
Running for 4.1
No ALTQ support in kernel
ALTQ related functions disabled
pf enabled
Installing "mobi.monaca.plugins.Monaca" for android
cordova version not detected (lacks script "/private/tmp/monaca/571550297e2193515015be16/android/skeleton/platforms/android/cordova/version" ), continuing.
No ALTQ support in kernel
ALTQ related functions disabled
pf disabled
No ALTQ support in kernel
ALTQ related functions disabled
pf enabled
Installing "org.apache.cordova.splashscreen" for android
No ALTQ support in kernel
ALTQ related functions disabled
pf disabled
No ALTQ support in kernel
ALTQ related functions disabled
pf enabled
Installing "org.apache.cordova.camera" for android
No ALTQ support in kernel
ALTQ related functions disabled
pf disabled
No ALTQ support in kernel
ALTQ related functions disabled
pf enabled
Installing "org.apache.cordova.file" for android
No ALTQ support in kernel
ALTQ related functions disabled
pf disabled
No ALTQ support in kernel
ALTQ related functions disabled
pf enabled
Installing "org.apache.cordova.file-transfer" for android
No ALTQ support in kernel
ALTQ related functions disabled
pf disabled
No ALTQ support in kernel
ALTQ related functions disabled
pf enabled
Installing "org.apache.cordova.geolocation" for android
No ALTQ support in kernel
ALTQ related functions disabled
pf disabled
No ALTQ support in kernel
ALTQ related functions disabled
pf enabled
Installing "phonegap-plugin-push" for android
cordova version not detected (lacks script "/private/tmp/monaca/571550297e2193515015be16/android/skeleton/platforms/android/cordova/version" ), continuing.
cordova-android version not detected (lacks script "/private/tmp/monaca/571550297e2193515015be16/android/skeleton/platforms/android/cordova/version" ), continuing.
Error during processing of action! Attempting to revert...
Failed to install 'phonegap-plugin-push':Error: Uh oh!
cannot find "/Applications/adt-bundle-mac/sdk/com.android.support:support-v13:23+/project.properties" referenced in <framework>
    at Object.AndroidProject.addSubProject (/data/monaca_build_module/4.1/node_modules/cordova/node_modules/cordova-lib/src/plugman/util/android-project.js:70:51)
    at module.exports.framework.install (/data/monaca_build_module/4.1/node_modules/cordova/node_modules/cordova-lib/src/plugman/platforms/android.js:110:27)
    at Object.ActionStack.process (/data/monaca_build_module/4.1/node_modules/cordova/node_modules/cordova-lib/src/plugman/util/action-stack.js:72:25)
    at handleInstall (/data/monaca_build_module/4.1/node_modules/cordova/node_modules/cordova-lib/src/plugman/install.js:591:20)
    at /data/monaca_build_module/4.1/node_modules/cordova/node_modules/cordova-lib/src/plugman/install.js:340:28
    at _fulfilled (/data/monaca_build_module/4.1/node_modules/cordova/node_modules/q/q.js:787:54)
    at self.promiseDispatch.done (/data/monaca_build_module/4.1/node_modules/cordova/node_modules/q/q.js:816:30)
    at Promise.promise.promiseDispatch (/data/monaca_build_module/4.1/node_modules/cordova/node_modules/q/q.js:749:13)
    at /data/monaca_build_module/4.1/node_modules/cordova/node_modules/q/q.js:509:49
    at flush (/data/monaca_build_module/4.1/node_modules/cordova/node_modules/q/q.js:108:17)
Error: Uh oh!
cannot find "/Applications/adt-bundle-mac/sdk/com.android.support:support-v13:23+/project.properties" referenced in <framework>
    at Object.AndroidProject.addSubProject (/data/monaca_build_module/4.1/node_modules/cordova/node_modules/cordova-lib/src/plugman/util/android-project.js:70:51)
    at module.exports.framework.install (/data/monaca_build_module/4.1/node_modules/cordova/node_modules/cordova-lib/src/plugman/platforms/android.js:110:27)
    at Object.ActionStack.process (/data/monaca_build_module/4.1/node_modules/cordova/node_modules/cordova-lib/src/plugman/util/action-stack.js:72:25)
    at handleInstall (/data/monaca_build_module/4.1/node_modules/cordova/node_modules/cordova-lib/src/plugman/install.js:591:20)
    at /data/monaca_build_module/4.1/node_modules/cordova/node_modules/cordova-lib/src/plugman/install.js:340:28
    at _fulfilled (/data/monaca_build_module/4.1/node_modules/cordova/node_modules/q/q.js:787:54)
    at self.promiseDispatch.done (/data/monaca_build_module/4.1/node_modules/cordova/node_modules/q/q.js:816:30)
    at Promise.promise.promiseDispatch (/data/monaca_build_module/4.1/node_modules/cordova/node_modules/q/q.js:749:13)
    at /data/monaca_build_module/4.1/node_modules/cordova/node_modules/q/q.js:509:49
    at flush (/data/monaca_build_module/4.1/node_modules/cordova/node_modules/q/q.js:108:17)
Build error: Error building project source code

演示： http://plnkr.co/edit/zQOMttjnbvdf6OJNOeoq?p=preview

如果您不需要新的隔离范围，则另一个：

.directive('customDir', function() {
    return {
        scope: {customDir: '='},
        link: function(scope, element, attrs) {
            scope.customDir += ' Word';
        }
    }
});

演示： http://plnkr.co/edit/FmIy3z4t1SEJQn1YQAkP?p=preview