个人中心
gpt4 book ai didi

android - Android webview 中如何将 JSON 传递给 AngularJS？

转载 作者：塔克拉玛干 更新时间：2023-11-03 00:47:49 25 4
gpt4 key购买 nike

我正在尝试使用 Android Webview 来显示一些“Activity ”内容(根据某些输入设置而变化的图像集)。内容将是本地的(离线的)。

我想使用 Angular.js 来控制将在页面上显示的媒体。

那么，问题来了……我的 Angular 应用程序如何在启动时接收 JSON 数据？我看到的问题是 webview 不允许 Angular 延迟加载其他文件(我在尝试将 html 模板用于自定义指令时已经遇到过这个问题。这需要将 HTML 模板封装到单个 HTML 文件中)。

我的 Android Activity 可以在某处写出选项，但 Angular 将如何读取它们？换句话说，有没有办法绕过不允许 Angular.js 延迟加载其他文件的 webview 的安全设置？

最佳答案

我想我已经解决了这个问题。我意识到我可以在我的 Android Java 代码中创建一个暴露给 JavaScript 的方法(通过 @JavascriptInterface)。这将允许我从我的 AngularJS 应用程序调用此方法以获取字符串中的 JSON(有关 JavascriptInterface 的信息，请参阅此链接:http://developer.android.com/guide/webapps/webview.html)。一旦我证明这是可行的，我将发布一些代码。

这是代码。效果很好。

主 Activity .java

public class MainActivity extends Activity {
    private String MY_JSON_EXAMPLE = "{\"name\":\"John Doe\",\"email\":\"jdoe@testco.com\"}";

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        WebView wv = (WebView) findViewById(R.id.myWebView);
        wv.getSettings().setJavaScriptEnabled(true);
        wv.addJavascriptInterface(this, "AndroidMainAct");
        wv.loadUrl("file:///android_asset/mypage.html");
    }

    @JavascriptInterface
    public String getMyJSONData() {
        return MY_JSON_EXAMPLE;
    }
}

我的页面.html

<!DOCTYPE html>
<html ng-app="myApp">
<head>
    <title>Hello World, AngularJS</title>
    <script type="text/javascript" src="angular.min.js"></script>
    <script type="text/javascript" src="app.js"></script>
</head>
<body>
    <h3>Load Test</h3>
    <div ng-controller="MyController">
        <div id="dataWaiting" ng-show="!myData.length">
            Loading JSON...
        </div>
        <div id="dataLoaded" ng-show="myData.length">
            Data Loaded: {{myData}}
        </div>
    </div>
</body>
</html>

应用程序.js

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

myApp.controller('MyController', ['$scope', function($scope) {
    $scope.myData = '';

    this.loadData = function() {
        // get the data from android
        return AndroidMainAct.getMyJSONData();
    };

    $scope.myData = this.loadData(); // load data on instantiation
}]);

通过 android JavascriptInterface 方法公开数据效果很好。

关于android - Android webview 中如何将 JSON 传递给 AngularJS？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/26079467/

25 4 0
文章推荐： c++ - OpenGL: Gamma 校正后的图像看起来不是线性的
文章推荐： linux - 无法通过 ssh 进入 EC2 实例
文章推荐： java - 从 C++ 启动时正确关闭 JVM
文章推荐： mysql - 在 2GB 的 sql.gz 文件中搜索常用词
塔克拉玛干
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com