Как использовать Angular JS для обновления страницы при изменении входного параметра для события

0

У меня есть действующее решение, использующее webform (.aspx), С# и некоторые Javascript. Я мог бы использовать некоторую помощь в обучении с использованием Angular JS.

Я ищу способ переписать решение как страницу в приложении Angular JS. На странице примера есть элемент управления Dropdownlist, когда элемент выбран, div "axviewer" должен быть обновлен на основе текущего значения члена страницы "configJson". configJson - это значение, возвращаемое из статического метода С#, в котором выбран SelectedItem.


  <html> <head>
    <title>ActiveX Viewer Sample Launch Page</title>
            <script type="text/javascript">
        $(document).ready(function () {
            // configJson is updated and returned by a C# public static method
            // based on the selection in the list
            var ax = igc.be.client.activex.createInstance(<% =configJson %>);
            ax.render("axviewer");            
        });
    </script> </head> <body>    
    <form runat="server">
        <input type="button" id="prev" value='<' />
        <asp:DropDownList ID="DropDownList1" runat="server" AutoPostBack="true" >
            <asp:ListItem>288</asp:ListItem>      
            <asp:ListItem>483</asp:ListItem>
            <asp:ListItem>488</asp:ListItem>
            <asp:ListItem>501</asp:ListItem>                              
        </asp:DropDownList>
    </form>
     <hr />
    <%--Display the Brava Viewer--%>    
    <div id="axviewer"></div>

    <div id="errorMesage" runat="server" visible="false">
        <asp:Label runat="server" ForeColor="Red" ID="Description">Something is wrong!</asp:Label>
    </div> </body> </html>

Код позади:

public partial class Viewer: System.Web.UI.Page {
private static string instanceId;
public static string configJson = string.Empty;

    protected void Page_Load(object sender, EventArgs e)
    {
        errorMesage.Visible = false;           
        string docId = "273";
        try
        {
            // return a json config string                
            var selectedId = this.DropDownList1.SelectedValue;
            instanceId = this.DropDownList1.SelectedValue;
            configJson = ActiveXViewer.GetViewerConfigJson(instanceId, "admin:admin", docId);  

        }
        catch (Exception ex)
        {
            errorMesage.Visible = true;
            Description.Text = ex.Message;

        }
    }

Теги:

1 ответ

0

насколько я могу понять из вашего вопроса, кажется, что это не тот сложный, что вы хотите сделать, но я бы предложил вам сначала попробовать его самостоятельно.

Я могу помочь вам с некоторыми подсказками,

сначала создайте настраиваемую директиву, чтобы подражать вашим материалам, которые вы делаете, чтобы манипулировать DIV на основе выбранного элемента

СОВЕТ: http://www.tutorialspoint.com/angularjs/angularjs_custom_directives.htm

затем измените выпадающий выбор, используя директиву ng-select. https://docs.angularjs.org/api/ng/directive/select

отдохните, если вы новичок, я бы предложил пойти с этим первым, чтобы сделать четкую картину в вашем уме, что то, что n, как угловые работы

https://www.codeschool.com/courses/shaping-up-with-angular-js

Я надеюсь, что решит вашу проблему

Ещё вопросы

Сообщество Overcoder
Наверх
Меню