Angular You may need an appropriate loader error

Question

I am trying to embed an aws quick sight dashboard on an angular app.

I am following the below URL to implement on Angular https://github.com/awslabs/amazon-quicksight-embedding-sdk

Could you please help me with sample code on how to implement the below logic in Angular

 <!DOCTYPE html>
    <html>

    <head>
        <title>Basic Embed</title>
        <script src="https://unpkg.com/amazon-quicksight-embedding-sdk@1.0.3/dist/quicksight-embedding-js-sdk.min.js" />
        <script type="text/javascript">
            var dashboard
            function onDashboardLoad(payload) {
                console.log("Do something when the dashboard is fully loaded.");
            }

            function onError(payload) {
                console.log("Do something when the dashboard fails loading");
            }

            function embedDashboard() {
                var containerDiv = document.getElementById("dashboardContainer");
                var options = {
                    url: "https://us-east-1.quicksight.aws.amazon.com/sn/dashboards/dashboardId?isauthcode=true&identityprovider=quicksight&code=authcode",
                    container: containerDiv,
                    parameters: {
                        country: "United States"
                    },
                    scrolling: "no",
                    height: "700px",
                    width: "1000px"
                };
                dashboard = QuickSightEmbedding.embedDashboard(options);
                dashboard.on("error", onError);
                dashboard.on("load", onDashboardLoad);
            }

            function onCountryChange(obj) {
                dashboard.setParameters({country: obj.value});
            }
        </script>
    </head>

    <body onload="embedDashboard()">
        <span>
            <label for="country">Country</label>
            <select id="country" name="country" onchange="onCountryChange(this)">
                <option value="United States">United States</option>
                <option value="Mexico">Mexico</option>
                <option value="Canada">Canada</option>
            </select>
        </span>
        <div id="dashboardContainer"></div>
    </body>

    </html>

I am getting compile time error while importing embedDashboard module

import {embedDashboard} from 'amazon-quicksight-embedding-sdk/src';

ERROR in ./node_modules/amazon-quicksight-embedding-sdk/src/embedDashboard.js 6:12 Module parse failed: Unexpected token (6:12) You may need an appropriate loader to handle this file type. | | import EmbeddableDashboard from './EmbeddableDashboard';

import type {EmbeddingOptions} from './lib/types'; |

How do I implement the above logic through angular? When I am trying to import QuickSightEmbedding for using the embedDashboard(options). I am getting compile time error.

Answer 1

如果完全可以使用，那么您的导入语句应如下所示： import QuickSightEmbedding from 'amazon-quicksight-embedding-sdk' 。

Angular You may need an appropriate loader error

Question

1 answers

solution1
0 2019-07-18 20:22:52

Angular You may need an appropriate loader error

Question

1 answers

solution1 0 2019-07-18 20:22:52

solution1
0 2019-07-18 20:22:52