我使用角度为1.6.4的电子。
我有一个控制器,我在其中动态生成<?xml version="1.0" encoding="utf-8" standalone="no"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:versionCode="43" android:versionName="2.2.2" package="ca.bell.selfserve.mybellmobile.poc2">
<uses-permission android:name="android.permission.INTERNET"/>
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>
<uses-permission android:name="android.permission.ACCESS_WIFI_STATE"/>
<uses-permission android:name="android.permission.READ_PHONE_STATE"/>\
<uses-permission android:name="android.permission.SET_DEBUG_APP"/>
<uses-permission android:description="@string/wifi_state_desc" android:label="@string/wifi_state_label" android:name="android.permission.CHANGE_WIFI_STATE" android:protectionLevel="signature"/>
<uses-permission android:description="@string/wifi_state_desc" android:label="@string/wifi_state_label" android:name="android.permission.CHANGE_NETWORK_STATE" android:protectionLevel="signature"/>
<uses-permission android:name="android.permission.WRITE_SETTINGS" android:protectionLevel="signature"/>
<uses-permission android:description="@string/loc_permission_desc" android:label="@string/loc_permission_label" android:name="android.permission.ACCESS_COARSE_LOCATION" android:protectionLevel="dangerous"/>
<uses-permission android:description="@string/loc_permission_desc" android:label="@string/loc_permission_label" android:name="android.permission.ACCESS_FINE_LOCATION" android:protectionLevel="dangerous"/>
<application android:allowBackup="true" android:fullBackupContent="@xml/full_backup_content" android:icon="@drawable/ic_launcher" android:label="@string/app_name" android:name="com.pega.mobile.ContainerApplication" android:theme="@style/AppTheme" tools:ignore="UnusedAttribute">
<activity android:configChanges="orientation|screenSize|keyboardHidden" android:launchMode="singleTop" android:name="com.pega.mobile.MainActivity" android:screenOrientation="portrait" android:windowSoftInputMode="adjustResize">
<intent-filter>
<action android:name="android.intent.action.MAIN"/>
<category android:name="android.intent.category.LAUNCHER"/>
</intent-filter>
</activity>
<provider android:authorities="ca.bell.selfserve.mybellmobile.fileProvider" android:exported="false" android:grantUriPermissions="true" android:name="android.support.v4.content.FileProvider">
<meta-data android:name="android.support.FILE_PROVIDER_PATHS" android:resource="@xml/file_paths"/>
</provider>
</application>
</manifest>
。我想在此列表项上绑定双击事件,但我无法成功。
li
如果我双击这里,绝对没有任何反应 - 甚至不是例外。
如果我使用function TheController($http, $scope, KeyService) {
$scope.openItem = function(id) {
console.log(id);
}
var key = KeyService.getLastKey();
connectToBackend($http,key);
}
function connectToBackend($http, key) {
$http.get(ENDPOINT).then(
function(result) {
//do some work
document.getElementById("list").innerHTML += `<li draggable="true" ondragstart="itemDrag(event)" id=${theID} ng-dblclick="openItem(this.id)"><i class="fa fa-folder-open"></i> ${result}</li><hr>`;
},
function(e) {
//error
}
);
}
,则可以在ondblclick
中定义openItem
。但是我希望在renderer.js
内定义它,以保持一些顺序并能够访问注入的服务。
这可能吗?阻力可能会干扰吗?
答案 0 :(得分:1)
直接附加的html在编译之前不起作用。您应该在将其注入DOM树之前手动编译它。
document.getElementById("list")
.appendChild($compile(`
<li draggable="true" ondragstart="itemDrag(event)"
id=${theID} ng-dblclick="openItem(this.id)">
<i class="fa fa-folder-open"></i> ${result}
</li>
<hr>`)($scope);
通常从直接控制器执行DOM操作是反模式的,因为它使您的控制器代码与view / html更紧密地耦合。
相反,我建议您使用ng-inlcude
指令并在ng-template
脚本中放置自定义模板。这样它就可以在角度$templateCache
内随时可用。
<script id="myCustom.html" type="text/ng-template">
<li draggable="true" ondragstart="itemDrag(event)"
id="{{theId}}" ng-dblclick="openItem(id)">
<i class="fa fa-folder-open"></i>
<div ng-include="ENDPOINT"></div>
</li>
</script>
然后你的html将如下所示。
<强> HTML 强>
<div id="list">
... Your content ..
</div>
<div ng-include="'myCustom.html'"></div>
如果你注意到,我直接在ENDPOINT
内直接使用了ng-include
来实现同样的工作,你必须做一些额外的设置
angular.module('myApp').config(function($sceDelegateProvider) {
$sceDelegateProvider.resourceUrlWhitelist([
// Allow loading from outer templates domain.
'http://somedomain.com/templates/**' //ENDPOINT domain should white listed here
]);
});
在使用angular wrapper指令修补它之前,ondragstart
也不会调用您的控制器方法。那里有第三方库,您可以使用其中任何一个。